0

I am currently using jQuery DataTables to query a large data source, and each request takes about 2-5 seconds to run. The problem I'm running into is that the users will type much faster than that - firing off a new ajax request before the previous request is complete.

Is there some way in DataTables to make the ajax requests fire sequentially, i.e. only make a new request when the previous request is completed?

Here is my code

$(document).ready(function () {

        $("#applicationListServerSide").DataTable({
            mark: true,
            "processing": true, // for show progress bar
            "order": [[0, "desc"]],
            "serverSide": true, // for process server side
            "filter": true, // this is for disable filter (search box)
            "orderMulti": false, // for disable multiple column at once
            "searchDelay": 2000,
            "lengthMenu": [[25, 50, -1], [25, 50, "All"]],
            "ajax": {
                "url": "/Admin/LoadData",
                "type": "POST",
                "datatype": "json"
            }
        });
    });
Steve French
  • 961
  • 3
  • 13
  • 38
  • look at JS callback functions. – SANM2009 Jan 17 '18 at 22:55
  • Unfortunately, looking at the [source](https://github.com/DataTables/DataTablesSrc/blob/f2f232921d12abce0cb8e6db64eae0e3ce58f008/js/core/core.ajax.js) code, there doesn't seem to be a way to intercept the ajax calls for filtering. Even the `preXHR` event will not allow you to stop the ajax call. – Forty3 Jan 17 '18 at 22:56

1 Answers1

0

You can configure the ajax to make a synchronous call using $.ajaxSetup(). This should override the base settings. The downside is that all the ajax calls on that context will be synchronous. You need to see if this solution will work for you for all your cases. Otherwise you need to add this config based on page or route.

https://api.jquery.com/jquery.ajaxsetup/

$.ajaxSetup({
  async: false
});
karthick
  • 11,998
  • 6
  • 56
  • 88