Thursday, 27 December 2018

Datatable - Sorting not working and icon are not coming

please help me in this. I have tried my level best to for SORTING to work. Whenever any column header is clicked, I goes to server side but all the values comes as NULL e.g. start, length, draw, sortColum. this is happening when clicked on header only. Pagination is working fine.

Any help is appreciated.

Below is my Client Side Code.

var dataTable = $('#SettlementTable').DataTable({
    "processing": true, // for show progress bar
    "serverSide": true, // for process server side
    "filter": true, // this is for disable filter (search box)
    "orderMulti": false, // for disable multiple column at once
    destroy: true,
    "language": {
        "zeroRecords": "<center>No record(s) found !</center>"
    },
    "ajax": {
        "url": "http://localhost/Payments.Productization.GlobalPaymentUI/Home/LoadData",
        "type": "POST",
        "datatype": "json",
        "data": function (d) {
            d.region = $("#region").val();
            d.country = $("#country").val();
            d.paymentType = $("#paymentType").val();
            d.searchGroup = $("#SearchGroup").val();
            d.searchValue = $("#txtSearch").val();
        },
        dataSrc: function (response) {
            if (response.status === "success") {
                $("#seachResult").show();
                return response.data;
            } else {
                $("#SettlementTable_processing").hide();
                showErrorMessage(response.error);
                return null;
            }
        }
    },
    "columns": [
        {
            "class": "details-control",
            "data": null,
            "orderable": false,
            "defaultContent": ""
        },
        { "data": "country", "orderable": true },
        { "data": "boNumber", "orderable": true },
        { "data": "foNumber", "orderable": true},
        { "data": "dpid", "orderable": true},
        { "data": "customer", "orderable": true},
        { "data": "totalAmount", "orderable": true },
        { "data": "invoiceNumber", "orderable": true},
        { "data": "creditMemo", "orderable": true },
        { "data": "orderStatus", "orderable": true },
        { "data": "orderDate", "orderable": true }
    ],
    "order": [[3, "desc"]]
});

Below is my server Side Code.

  var draw = HttpContext.Request.Form["draw"].FirstOrDefault();
        // Skiping number of Rows count
        var start = Request.Form["start"].FirstOrDefault();
        // Paging Length 10,20
        var length = Request.Form["length"].FirstOrDefault();
        // Sort Column Name
        var sortColumn = Request.Form["columns[" + Request.Form["order[0][column]"].FirstOrDefault() + "][name]"].FirstOrDefault();
        // Sort Column Direction ( asc ,desc)
        var sortColumnDirection = Request.Form["order[0][dir]"].FirstOrDefault();
        // Search Value from (Search box)
        var searchValue = Request.Form["search[value]"].FirstOrDefault();

Below is rendering.

enter image description here



from Datatable - Sorting not working and icon are not coming

No comments:

Post a Comment