JQuery的数据表不能识别载入的数据 [英] JQuery DataTables does not recognize data loaded

查看:125
本文介绍了JQuery的数据表不能识别载入的数据的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

由于某些原因,我的JQuery数据表是将数据添加到表中,但它仍然表示,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]);
                });
            }


        });

我的控制器code:

My Controller code:

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>

下面是我所得到的截图:

Here is a screenshot of what I get:

在这里输入的形象描述

推荐答案

在使用服务器端的数据源,你需要处理的搜索,排序和放大器;寻呼服务器code。

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的网络面板,可以看到所有的请求加载数据表时,发送的参数。你需要在你的服务器code得到这些和您的查询,如: 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的这里

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

这篇关于JQuery的数据表不能识别载入的数据的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆