简体   繁体   English

jQuery数据表和排序列

[英]jquery data table and sorting columns

I'm using jquery data table to display large amounts of data inside grid. 我正在使用jquery数据表在网格内显示大量数据。 I implemented server side pagination but I'm struggling with sorting data server side. 我实现了服务器端分页,但是正在努力对数据服务器端进行排序。

Below is my datatable initialization, answer with query for sorting is not the subject here, I just need a way to pass information of which column is clicked to the controller, the one upon I will do the sorting. 下面是我的数据表初始化,这里的主题不是排序查询的答案,我只需要一种方法就可以将单击哪一列的信息传递给控制器​​,我将进行排序。

('#myTable').dataTable({
      "processing": true,
       "serverSide": true,
        "info": false,
        "pageLength": 10,
        "lengthChange": false,
        "stateSave": false,
        "bPaginate": true,
        "bFilter": false,
        "sPaginationType": "full_numbers",
         "info": "Page _PAGE_ from _PAGES_",
         "infoEmpty": "No data",
         "oPaginate": {
             "sFirst": "First",
             "sPrevious": "Previous",
             "sNext": "Next",
             "sLast": "Last"
          },
          "ajax": {
              "url": "@string.Format("{0}://{1}{2}", Request.Url.Scheme, Request.Url.Authority, Url.Content("~"))/MyController/GetData",
                        "type": "GET",
                        "data": function (d) {
                          .....
                        },
                    },
                    preDrawCallback: function (settings) {
                         ...
                    },
                    drawCallback: function (settings) {
                         ...
                    },                      
                    "columns": [
                          { "data": "Id" },
                          { "data": "FirstName" },
                          { "data": "LastName" },
                          { "data": "Age" }
                    ],
                    "columnDefs": [
                       {
                           targets: [0],
                           orderable: false
                       },
                       {
                           render: function (data, type, row) {
                               ...
                       }
                    ],
                    "order": [[0, "desc"]]
                });

public ActionResult GetData(){
   var sortColumn = ...
   ...
}

You can bind the 'order' event like this: 您可以像这样绑定“ order”事件:

$('#myTable').on( 'order.dt', function () {

    var order = table.order();
    var column_selected = order[0][0];
    var order_way= order[0][1];
    doStuff(column_selected ,order_way);

});

See it in plugin reference 在插件参考中查看

By specifying "serverSide": true, , datatables will by default add information to the request which you need to use in your server-side code. 通过指定"serverSide": true, 默认情况下会将信息添加到您需要在服务器端代码中使用的请求。 If you look in the Firebug Network panel, you will be able to see the request with the querystring parameters. 如果您在Firebug的“网络”面板中查看,您将能够看到带有querystring参数的请求。 See here for the full list of parameters. 有关完整的参数列表,请参见此处 Note that the link is to the v1.9 documentation, because that's what it looks like you're using. 请注意,该链接指向v1.9文档,因为这就是您所使用的样子。

So for sorting, you'd be interested in iSortCol_0 and sSortDir_0 which relate to the clicked column and the sort direction respectively. 因此,对于排序,您iSortCol_0sSortDir_0感兴趣, sSortDir_0分别与单击的列和排序方向有关。

In your controller method, you would access the parameters like this: 在控制器方法中,您将像这样访问参数:

var sortColumnIndex = Convert.ToInt32(Request["iSortCol_0"]);
var sortColumnDir = Request["sSortDir_0"];

You then need to incorporate this, and the other parameters into your query. 然后,您需要将此以及其他参数合并到查询中。

Here is an article on using server-side datatables with MVC 这是有关将服务器端数据表与MVC一起使用的文章

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM