[英]How to pass form values to the controller and return values to the jQuery datatables
What I want to do is like this. 我想做的就是这样。
After I submit the forms, values in the forms are passed to the controller, and the values are transformed and returned to the datatable. 提交表单后,表单中的值将传递到控制器,然后将值转换并返回到数据表。
I know how to return json data to the datatable from the controller. 我知道如何从控制器将json数据返回到数据表。
Also I know how to pass form values to the controller by Ajax.BeginForm. 我也知道如何通过Ajax.BeginForm将表单值传递给控制器。
But I don't know how to do the both. 但是我不知道怎么做。
Here is my code that just returns fixed json data to the datatables. 这是我的代码,仅将固定的json数据返回到数据表。
View 视图
<script type="text/javascript">
function PullIntoTable() {
$('#example').dataTable({
"bDestroy": true,
"bAutoWidth": false,
"aoColumns": [
{ sWidth: '30%' },
{ sWidth: '10%' },
{ sWidth: '20%' },
{ sWidth: '20%' },
{ sWidth: '20%' }, ],
"sAjaxSource": '@Url.Action("Search", "SearchCompany")',
"fnServerData": function (sSource, aoData, fnCallback) {
$.ajax({
dataType: 'json',
type: "POST",
url: sSource,
data: aoData,
success: function (json) {
fnCallback(json);
}
})
}
});
};
</script>
<input type="submit" value="Search" onclick="PullIntoTable()" />
<table cellpadding="0" cellspacing="0" border="0" class="search_result" id="example" width="100%">
<thead>
<tr>
<th>Company</th>
<th>Location</th>
<th>Address</th>
<th>Status</th>
<th>Inactive</th>
</tr>
</thead>
<tbody>
</tbody>
<tfoot>
<tr>
<th></th>
<th></th>
<th></th>
<th></th>
<th></th>
</tr>
</tfoot>
</table>
Controller 控制者
public class SearchCompanyController : Controller
{
[HttpPost]
public ActionResult Search()
{
var Result = new List<Result>()
{
new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"}
};
return Json(
new { aaData = Result.Select(x => new[] { x.Name, x.Location, x.Address, x.Status, x.Inactive }) },
JsonRequestBehavior.DenyGet
);
}
}
public struct Result
{
public string Name { get; set; }
public string Location { get; set; }
public string Address { get; set; }
public string Status { get; set; }
public string Inactive { get; set; }
}
Datatables requires the data in a very specific format . 数据表需要非常特定的格式的数据。
There's an example using OpenSearch , which you can glean details to use for your specific implementation (ie, a non-datatables specific implementation in which you construct the json object in javascript for the callback). 有一个使用OpenSearch的示例 ,您可以收集用于特定实现的详细信息(即,非数据表特定的实现,在该实现中,您可以使用JavaScript在回调中构造json对象)。 This solution appeals to me the most because it keeps the datatables-specific implementation details out of your server-side code.
该解决方案对我最有吸引力,因为它使特定于数据表的实现详细信息不包含在服务器端代码中。
There are already asp.net samples on the datatables.net site that give you largely everything you need, albeit in rather ugly hungarian notation format. datatables.net站点上已经有asp.net 示例,可以为您提供所需的大部分内容,尽管采用的是匈牙利符号格式。
I don't have a sample at my fingertips, but I did take the c# sample and convert it into an actionfilter so I did not have to to deal with the hungarian notation. 我手边没有样本,但是我确实将c#样本转换为一个动作过滤器,因此不必处理匈牙利符号。 If I lay my hands on it, and you're interested, I'll see if I can post it up here.
如果我把手放在上面,并且您有兴趣,我会看看是否可以在此处发布。
It was solved. 解决了
I could get values from the controllers and pull them into the datatable like the following 我可以从控制器获取值,然后将它们拉入数据表,如下所示
View Script 查看脚本
function PullIntoTable(e) {
$('#example').dataTable({
"bDestroy": true,
"bAutoWidth": false,
"aoColumns": [
{ sWidth: '30%' },
{ sWidth: '10%' },
{ sWidth: '20%' },
{ sWidth: '20%' },
{ sWidth: '20%' }, ],
"aaData": e.aaData
});
};
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.