JQuery DataTables无法识别加载的数据 [英] JQuery DataTables does not recognize data loaded

问题描述

由于某些原因，我的JQuery DataTable正在向表中添加数据，但仍然表示0到0的0条目。尝试使用搜索框实际上并不搜索数据，而是按照我的列进行排序不改变订单，我没有在firebug中收到任何错误，所以我真的不知道从哪里去，谢谢你的看法。

For some reason, my JQuery DataTable is adding data to the table, but it still says "0 to 0 of 0 entries. Trying to use the search box does not actually search through my data, and sorting by my one column does not change the order. I don't get any errors in firebug, so I don't really know where to go from here. Thank you for looking.

这里是javascript：

Here is the javascript:

var oTable = $("#tblAddUsers").dataTable({
            "processing": true,
            "bSearching": true,
            "bSort": true,
            "bFilter": true,
            sAjaxSource: '@Url.Action("GetUserList", "ClassSchedule")',
            aoColumns: [
                {
                    bVisible: false
                },
                {
                    sWidth: "250px",
                    bSortable: true

                },
                {
                    mRender: function () { return '<button class="clAddUser">Add</button>'; },
                    sWidth: "200px"
                }
            ],

            fnRowCallback: function (nRow, aData, iDisplayIndex, iDisplayIndexFull) {

                $('button', nRow).on('click', function () { 
                    test(aData[0]);
                });
            }


        });

我的控制器代码：

public JsonResult GetUserList()
    {
        var addUserList = (from u in db.t_user
                           join m in db.t_user_membership on u.user_id equals m.user_id
                           where m.membership_date > DateTime.Today
                           select new { user_id = u.user_id, full_name = u.first_name + " " + u.last_name }).ToList();

        return Json(new { aaData = addUserList.Select(x => new string [] { x.user_id.ToString(), x.full_name }) }, JsonRequestBehavior.AllowGet);
    }

我的GET响应如下所示：

My GET response looks like this:

{"aaData":[["2","test Spouse"],["3","David Parker"]]}

这是我的HTML：

<div id="AddUserPopup" style="display:none" title="">
<span>Add Users</span>
<div style="width: 500px; height: 300px;" id="dialog">
        <table id="tblAddUsers">
            <thead>
                <tr>
                    <th></th>
                    <th>User Name</th>
                    <th></th>
                </tr>
            </thead>
            <tbody>

            </tbody>
        </table>

</div>

这是一个截图我得到：

推荐答案

当使用服务器端数据源时，需要处理搜索，排序和在服务器代码中进行分页。

When using a server-side datasource, you need to handle the searching, sorting & paging in the server code.

看看传递给&从服务器这里。您没有传递任何这些信息 - 例如您得到显示0条0条目，因为您没有返回 iTotalRecords 和 iTotalDisplayRecords 在json数据中。返回的对象应该如下所示：

Have a look at the parameters that get passed to & from the server here. You're not passing any of this information - for example you get Showing 0 of 0 entries because you're not returning iTotalRecords and iTotalDisplayRecords in the json data. The returned object should look something like this:

return Json(new
{
    param.sEcho,
     iTotalRecords = rowCount,
     iTotalDisplayRecords = rowCount,
    aaData = result,
 }, JsonRequestBehavior.AllowGet)

如果您查看Firebug的Net面板，可以在加载datatable时查看请求中发送的所有参数。您需要在服务器代码中使用这些代码，并在查询中使用它们，例如 sSearch 进行搜索， iDisplayStart 和 iDisplayLength 用于分页。

If you look at Firebug's Net panel, you can see all the parameters that are sent in the request when loading the datatable. You need to get these in your server code and use them in your query, e.g sSearch for searching, iDisplayStart and iDisplayLength for paging.

我会这样做：

public JsonResult GetUserList(jQueryDataTableParamModel p)
{
    var addUserList = from u in db.t_user
       join m in db.t_user_membership on u.user_id equals m.user_id
       where m.membership_date > DateTime.Today
       select new mymodel
       { 
           user_id = u.user_id, 
           full_name = u.first_name + " " + u.last_name 
       };
//paging
    var displayedItems = addUserList.Skip(p.iDisplayStart).Take(p.iDisplayLength);
    var rowCount = addUserList.Count();

//  project into json for datatable
    var result = from d in displayedItems
                         select new object[]
                         {
                            d.user_id,
                            d.full_name
                          };
    return Json(new
    {
        param.sEcho,
        iTotalRecords = rowCount,
        iTotalDisplayRecords = rowCount,
        aaData = result,
     }, JsonRequestBehavior.AllowGet);
}

jQueryDataTableParamModel 参数来自关于在MVC中使用服务器端数据表的一个很好的教程 here

The jQueryDataTableParamModel parameter comes from a good tutorial on using server-side datatables in MVC here

这篇关于JQuery DataTables无法识别加载的数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！