简体   繁体   中英

dataTables sorting not working

I have a dataTable where i populating some data but i need the sorting operation enabled on that table.But my sorting is not working.This is my code i have done so far.

 $('#example').dataTable( { 
                                "processing": true,
                                "serverSide": true,
                                aaSorting: [[2, 'desc']],
                                "ajax": url,
                                "columns": [
                                    {"data" : "code"},        
                                    { "data": "description"},
                                    { "data" : "mrpString"},
                                    { "data":"unitDescription"},
                                    { "data":"moq"}
                                ],
                                 "columnDefs": [
                                             {
                                                 "targets": [ 0 ],
                                                 "visible": true,
                                                 "searchable": false,
                                                 "sortable" :false

                                             },
                                          {
                                                 "targets": [ 1 ],
                                                 "visible": true,
                                                 "searchable": true,
                                                 "sortable" :true

                                             },
                                          {
                                                 "targets": [ 2 ],
                                                 "visible": true,
                                                 "searchable": false

                                             },
                                          {
                                                 "targets": [ 3 ],
                                                 "visible": true,
                                                 "visible": true,
                                                 "searchable": true

                                             },
                                          {
                                                 "targets": [ 4 ],
                                                 "visible": true,
                                                 "visible": true,
                                                 "searchable": true

                                             }
                                         ], 

                                      "aoColumnDefs": [
                                                    { "bSortable": true, "aTargets": [0,1,2,3,4] }
                                                  ] ,  
 "rowCallback": function( row, data ) {
                                     $("td:eq(0)",row).html("<a href='"+data.url+"' target='_new'>"+data.code+"<//a/> ");
                                     //alert(data.parentCategoryId);
                                        /* $('td:eq(6)', row).html( '<input type="checkbox" name="selectedIds" value="'+data.id+'" />' ).attr("class","checkIds");
                                        $('td:eq(0)',row).attr('id','_'+data.id); */
                                 }

                            });
                    });

This is my code i have done searching is also working but i want sorting enanled ,somebody please help

I know it's an old post.. but check it out..

Server side means you are doing everything server side. On the server, whatever method that fetches the data for your table, is also responsible for the paging and sorting of your table. My sorting wasn't working.. then I realized that my server-side method wasn't doing the sorting! So.. in a nutshell, I added this to the server-side method or function responsible for providing data for my table (C#): (Note: "data" is a list of objects for my data table)

var myJsonOrder = JsonConvert.DeserializeObject<List<DataTableOrder>>(Request.Params["JsonOrder"]);
// Sorting
if (myJsonOrder != null && myJsonOrder.Count > 0)
{
    var firstOrder = myJsonOrder.FirstOrDefault();

    switch (firstOrder.column)
    {
        case 1:
            data = firstOrder.dir == "asc" ? data.OrderBy(x => x.TripName).ToList() : data.OrderByDescending(x => x.TripName).ToList();
            break;
        case 2:
            data = firstOrder.dir == "asc" ? data.OrderBy(x => x.TripStartDate).ToList() : data.OrderByDescending(x => x.TripStartDate).ToList();
            break;
        case 3:
            data = firstOrder.dir == "asc" ? data.OrderBy(x => x.NumTravelers).ToList() : data.OrderByDescending(x => x.NumTravelers).ToList();
            break;
        case 4:
            data = firstOrder.dir == "asc" ? data.OrderBy(x => x.NumCardsAssigned).ToList() : data.OrderByDescending(x => x.NumCardsAssigned).ToList();
            break;
    }
}

There is other data available in the request, such as the columns and search query:

var myJsonColumns = JsonConvert.DeserializeObject<List<DataTableColumn>>(Request.Params["JsonColumns"]);
var myJsonOrder = JsonConvert.DeserializeObject<List<DataTableOrder>>(Request.Params["JsonOrder"]);
var myJsonSearch = JsonConvert.DeserializeObject<DataTableSearch>(Request.Params["JsonSearch"]);

Edit: Sorry, learning this as I'm going.. that column / order / search data is available on the server because in my AJAX call for dataTables, I am passing the data to the server:

inactiveTravelerDataTable = $("#inactive-traveler-list-data-table").dataTable({
        "processing": true,
        "serverSide": true,
        "jQueryUI": true,
        "searching": false,
        "dom": 'rtipl',
        "ajax": {
            "url": '/Trip/JsonInactiveTravelerList/',
            "data": function(d) {
                d.TripId = $('#TripId').val();
                d.JsonColumns = JSON.stringify(d.columns);
                d.JsonOrder = JSON.stringify(d.order);
                d.JsonSearch = JSON.stringify(d.search);
            },
            "type": "POST"
        }
        //.... Continued on...

Hope this helps somebody.

Regards,

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

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