CODEWITHSUNDEEP
javascriptjquerydatatabledatatables
hetal gohel
hetal gohel

Reputation: 355

Reload datatable on dropdown changes with new value of dropdown

My code is as below ,

$(document).ready(function () {
    var filterDays = $("#countRecordsDay").val();
    dTable = $('#topcustomer_order').dataTable({
        bStateSave: true,
        responsive: false,
        bJQueryUI: false,
        bProcessing: true,
        bServerSide: true,
        bFilter: false,
        bLengthChange: false,
        "bAutoWidth": false,
        //multipleSelection: true,
        iDisplayLength: 10,
        sAjaxSource: CustomerOrderAjaxSource,
        dom: "<'row'<'col-sm-2'l><'col-sm-10'f>>" +
                "<'row'<'col-sm-12'tr>>" +
                "<'row'<'col-sm-12 text-right fullshowignentry'i><'col-sm-12'p>>",
        fnServerParams: function (aoData) {
            aoData.push({"name": "days", "value": filterDays});
        },
        aoColumns: [
            {"sName": "Id"},
            {"sName": "CustomerName"},
            {"sName": "Orders"},
        ],
        "aaSorting": [[0, 'desc']],
        sPaginationType: "full_numbers"});

    $('#countRecordsDay').change(function () {
        dTable.api().ajax.reload();
 });

it reloads the datatable but didn't get the value of new value of parameter , please can any person help me to sort it out ?

Upvotes: 1

Views: 847

Answers (1)

markpsmith
markpsmith

Reputation: 4918

It's because you assign the parameter value in $(document).ready i.e. when the page loads. This code doesn't get called when you filter the datatable so filterDays is always the default value.

The fix is simply this:

fnServerParams: function (aoData) {
     aoData.push({"name": "days", "value": $("#countRecordsDay").val()});
},

This way the parameter is always the currently selected value.

Upvotes: 1

Related Questions