ServerSide result but search in current visible result

postitief

Description of problem:
I'm using datatables with serverside data. When the page loads, the table is empty. After filling out a form, the datatables is triggerd to make a draw() with the data filled in the form. The result is not paginated and everything is shown on one page.

After the data is loaded (which can take up to 30 seconds), I want to be able to filter the data by the search box. So the datatable is hidding rows that do not match the search. When clearing the searchbox, all rows are show again.

This all should be done on the page, no AJAX call to the server, because this will take too long.

How can I do this? Using the filter function and hiding / unhiding rows? Or has datatables something build in for this? Note: I cannot use the default search because that will initialize a new call to the server.

allan

Your server-side processing call takes 30+ seconds to respond with 10 rows of data? There is something seriously wrong there if so. How are you implementing the server-side processing?

However, no, if you are using server-side processing, then the filtering is done by the server, not the client-side.

Allan

postitief

The datatable get's filled with data that needs a lot of calculating and can contain up to 1.500 rows. And all rows can have s detail-row as wel.
So there is nothing seriously wrong, it's just a huge amount of data that needs to be processed.

kthorngren

Are you using Server Side Processing? This means the server script should only be fetching the data to be displayed on the current page which should reduce processing time.

The result is not paginated and everything is shown on one page.

Either you are getting a Javascript error, check the browser's console, or you are using something outside of Datatables to populate the table - which means Datatables knwos nothing about the data and is not formatting the table and the search, etc doesn't work. Take a look at this FAQ.

Please provide more details of what you have. better provide a link to your page or a test case showing the issue so we can help debug.
https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

Kevin

postitief

First of all, I don't have any problems with the datatable itself. It is working perfect without any errors.

I only want to search te result that is already in the datatable and I don't want to do a new AJAX call to the server. I want to filter the data already available in the datatable.

Everything is shown in one page because paging is set to false

kthorngren

You still haven't confirmed if you have server side processing enabled.

If you have serverSide: true and you are showing everything on one page then disable server side processing as its not doing anything beneficial. Then you will be in client side processing and all the searches will be client side.

Kevin

postitief

Sorry, my opening post says I'm using datatables with serverside data. Meaning serverSide: true, maybe not all clear.

I want the datatable to be loaded serverSide. First the user needs to make some selections. Then clicks on a button to load the result of that selection.

If I set serverSide: false, the datatable want's to load the data directly, but because nothing is selected yet, the ajax call to the server will create a error. So that call should not be done on page load.

Setting serverSide: false indeed filters inside the result. That's the result I want, but with serverSide on true.

    processing: true,
    serverSide: false,
    deferLoading: 0,
    ajax: {
        url: $table.data('url'),
        data: function (d) {
            d.sup = $sup.val();
            d.brand = $brand.val();
        },
    },
    autoWidth: false,
    paging: false,

kthorngren

Well serverside data doesn't always mean server side processing is enabled

Yes deferLoading only works with server side processing.

For this case I would not use ajax and initialize an empty Datatable. Then use a jQuery ajax() to fetch the data and in the success function use rows.add() to populate the Datatable. Or some variation of this depending on your exact needs.

Kevin

kthorngren

Another option, if you want to use something like ajax.reload() is to return an empty data set, either {} or [], for the initial Datatable ajax request. This assumes the -ajax.data parameters you send are empty or have some default value you can key off of. Then use ajax.reload() to repopulate the table whenever the form data is changed.

Kevin

allan

If you only have 1.5k rows, then you shouldn't really need server-side processing, unless each row contains a lot of data!

Also

paging: false,

Negates any benefit of server-side processing. You are loading the full data set every time the table draws. You'd be much better of disabling server-side processing if you want paging disabled.

With only 1.5k rows, I would expect the data to load within seconds, so I still maintain that there is something wrong at the server-side. Perhaps you are doing some complex calculations or something?

Allan

postitief

@kkthorngren. That might be a better sollution because I'm kind of abusing the datatables this way.
However, I found out a way to filter the rows in the setup I have. When someone uses a custom search field, I'm using the filter() api to check if the row matches the criteria and hiddes or shows the row.

@allan, There is nothing wrong with the server-side script. It just does a huge amount of calculations and database queries. It does work in 15 - 30 seconds what a human costs more than 8 hours. That can't be optimized more then it already is.

kthorngren

You might be better off creating a search plugin instead of filter(). See this running example.

Kevin

postitief

I tried that as well, but then I first need to rebuild the datatables with serverside off. Else it will still doe a new ajax call at the .draw() action.

But I got the result I wanted. Thanks for helping out!

kthorngren

So you still have serverside: true and paging: false? In this case the search plugin wont help as its for client side processing. Sounds like you are using jQuery or something outside of Datatables to hide the rows.

If the table is sorting is changed all the data will be fetched from the server.

Kevin