DataTable server side ajax call and sorting/searching problem

modplus

Using DataTable 2.0.3 and asp.net 8. Making ajax call as part of the datatable and set serverside to true. The table rows/columns are being populated fine. However, I want to enable search for a single column (0) and I'm having some problem.

First, I am loading all the data in the initial ajax call and want to search only within those loaded data. But the Datatable automatically makes the ajax call for sorting even if I just click inside the search box. I want the ajax call completely disabled after the data is initially loaded. All search/sorting should happen within the loaded data without calling the server. How can I do this? I am willing to allow the ajax call if it not possible. I can remove ajax call and just bind a json array for data if I could change the action method in the controller but I can't.

JS:

var customerTable = $(#customerTable).DataTable({
    searching: true,
    paging: false,
    info: false,
    serverSide: true,
    autoWidth: false,
    scrollY: 'calc(100vh - 425px)',
    ajax: {
        url: getUrl,
        type: 'GET',
        data: ""
        }
    },
    select: {
        style: 'single'
    },
    columns: [
        {
            title: 'Name <br><input id="nameSearch" type=text placeholder="Search" style="width:140px;">',
            data: 'name',
            sortable: true,
            searchable: true
        },
        { title: 'Street', data: 'address', searchable: true, sortable: false},
        { title: 'City', data: 'city', searchable: true, sortable: false },
        { title: 'State', data: 'state', searchable: true, sortable: false},
        { title: 'ZipCode', data: 'zipcode', searchable: true, sortable: false }
    ],
    initComplete: function () {
        $("#nameSearch").on('keyup', function () {
            $("#customerTable").DataTable().column(0).search(this.value, false, true).draw();
        });
    }
});

Controller:

   public async Task<IActionResult> GetCustomer(IDataTablesRequest request)
   {
      ...
   }

allan

I want the ajax call completely disabled after the data is initially loaded.

Don't use server-side processing in that case. Every draw when server-side processing is enabled with trigger an Ajax call. You can still Ajax load data and use client-side processing.

See the manual for more details on the difference between client-side and server-side processing.

Allan