加载 ASP.Net MVC JSONResult jQuery 数据表 [英] Load ASP.Net MVC JSONResult jQuery DataTables
问题描述
我正在尝试让 DataTables(http://datatables.net) 使用 ASP.Net MVC 控制器返回的 JsonResult.我不断收到DataTables 警告(表 id = 'example'):从第 0 行的数据源请求未知参数 '0'"错误,根据文档,这意味着它找不到列.
I'm trying to get the DataTables(http://datatables.net) to work with a JsonResult returned by an ASP.Net MVC Controller. I keep getting a "DataTables warning (table id = 'example'): Requested unknown parameter '0' from the data source for row 0" error which according to the docs means it cant find the columns.
控制器中返回 JsonResult 的代码如下所示:
The code in controller that returns the JsonResult looks like:
public JsonResult LoadPhoneNumbers()
{
List<PhoneNumber> phoneNumbers = new List<PhoneNumber>();
PhoneNumber num1 = new PhoneNumber { Number = "555 123 4567", Description = "George" };
PhoneNumber num2 = new PhoneNumber { Number = "555 765 4321", Description = "Kevin" };
PhoneNumber num3 = new PhoneNumber { Number = "555 555 4781", Description = "Sam" };
phoneNumbers.Add(num1);
phoneNumbers.Add(num2);
phoneNumbers.Add(num3);
return Json(phoneNumbers, JsonRequestBehavior.AllowGet);
}
PhoneNumber 只是一个普通的 C# 类,具有 2 个属性,Number 和 Description.
PhoneNumber is just a plain C# class with 2 properties, Number and Description.
检索和加载数据的 javascript 如下所示:
The javascript that retrieves and loads the data looks like:
<script>
$(document).ready(function () {
$('#example').dataTable({
"bProcessing": true,
"sAjaxSource": '/Account/LoadPhoneNumbers/',
"sAjaxDataProp": ""
});
});
</script>
HTML 看起来像:
<table cellpadding="0" cellspacing="0" border="0" class="display" id="example">
<thead>
<tr>
<th>
Number
</th>
<th>
Description
</th>
</tr>
</thead>
<tbody>
</tbody>
<tfoot>
</tfoot>
</table>
我特意将 sAjaxDataProp 设置为空字符串,以便 DataTables 不会查找 aaData.即使我在控制器中像这样显式设置 aaData :
I've deliberately set sAjaxDataProp to an empty string so that DataTables does not look for aaData. Even when I explicitly set aaData like so in the controller:
return Json(new { aaData = phoneNumbers });
我仍然收到错误消息.请问有什么建议吗?
I still get the error. Any advice please?
谢谢!
推荐答案
以下对我很有用:
$(function () {
$('#example').dataTable({
bProcessing: true,
sAjaxSource: '@Url.Action("LoadPhoneNumbers", "Home")'
});
});
我已经删除了 sAjaxDataProp
属性.
I have removed the sAjaxDataProp
property.
使用此数据源:
public ActionResult LoadPhoneNumbers()
{
return Json(new
{
aaData = new[]
{
new [] { "Trident", "Internet Explorer 4.0", "Win 95+", "4", "X" },
new [] { "Gecko", "Firefox 1.5", "Win 98+ / OSX.2+", "1.8", "A" },
new [] { "Webkit", "iPod Touch / iPhone", "iPod", "420.1", "A" }
}
}, JsonRequestBehavior.AllowGet);
}
以您的手机为例:
public ActionResult LoadPhoneNumbers()
{
var phoneNumbers = new List<PhoneNumber>(new[]
{
new PhoneNumber { Number = "555 123 4567", Description = "George" },
new PhoneNumber { Number = "555 765 4321", Description = "Kevin" },
new PhoneNumber { Number = "555 555 4781", Description = "Sam" }
});
return Json(new
{
aaData = phoneNumbers.Select(x => new[] { x.Number, x.Description })
}, JsonRequestBehavior.AllowGet);
}
这篇关于加载 ASP.Net MVC JSONResult jQuery 数据表的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!