Question

我正在使用DataTable.js并尝试实现MVC。我按照以下方式编写了代码：

查看：

<div id="container">
    <div id="demo">
        <h2>Index</h2>
        <table id="myDataTable" class="display">
            <thead>
                <tr>
                    <th>ID</th>
                    <th>Event Name</th>
                    <th>Event Type</th>
                </tr>
            </thead>
            <tbody></tbody>
        </table>
    </div>
</div>
@section scripts{
    <script src="https://cdnjs.cloudflare.com/ajax/libs/datatables/1.10.16/js/jquery.dataTables.min.js"></script>
    <script>
        $(document).ready(function () {
            $('#myDataTable').dataTable({
                "bServerSide": true,
                "sAjaxSource": "@Url.Action("AjaxHandler","DataTable")",
                "bProcessing": true,
                "aoColumns": [
                    { "sName": "EventID" },
                    { "sName": "EventName" },
                    { "sName": "EventTypeTitle" }
                ]
            });
        }); 
    </script>
}

控制器：

public ActionResult Index()
{
      return View();
}


public ActionResult AjaxHandler(jQueryDataTableParamModel param)
{
      return Json(new
      {
           sEcho = param.sEcho,
           iTotalRecords = getAllEvent().Count(),
           iTotalDisplayRecords = getAllEvent().Count(),
           aaData = getAllEvent()
      }, JsonRequestBehavior.AllowGet);
}

private List<EventModel> getAllEvent()
{
      List<EventModel> model = new List<EventModel>();
      EventModel model1 = new EventModel { EventID = 1, EventName = "Event 1", EventType = 1, EventTypeTitle = "General" };
      model1.EventScheduleList = new List<EventScheduleModel> { new EventScheduleModel {EventScheduleID = 1 }, new EventScheduleModel { EventScheduleID = 2 } };
      model.Add(model1);
      return model;
}

我收到DataTables警告：table id = myDataTable - Requested 未知参数＆＃39; 0＆＃39;对于第0行，第0列。有关的更多信息此错误，请参阅http://datatables.net/tn/4

当我研究错误时，我发现当数据不正确时会发生这种特殊错误。但是，当我检查回复时，我得到了正确的数据。

是不是因为我返回了更多使用过的列数在视图中？或者我在JSON中发送整数值吗？

我也附上小提琴链接： https://dotnetfiddle.net/MEoqg8

Answer 1

您需要对JacaScript代码进行非常小的更改，这意味着代替使用sName，您需要在data数组中使用aoColumns。

    <script>
    $(document).ready(function () {
        $('#myDataTable').dataTable({
            "bServerSide": true,
            "sAjaxSource": '@Url.Action("AjaxHandler","Home")',
            "bProcessing": true,
            "aoColumns": [
                {
                    "data": "EventID",
                    "bSearchable": false,
                    "fnRender": function (oObj) {
                        return '<a href=\"Details/' +
                            oObj.aData[0] + '\">View</a>';
                    }
                },
                { "data": "EventName" },
                { "data": "EventTypeTitle" }
            ]
        });
    }); 
</script>

你可以在这里检查你的小提琴：https://dotnetfiddle.net/7sXghO

DataTables警告 - 请求的未知参数＆＃39; 0＆＃39;对于第0行，第0列

1 个答案: