DataTable Filtering Menu

rpatel

I want to create a Filtering Menu to allow the data being shown to be narrowed down. I have created sevreal Dropdown boxes which users can select from. I know how to get the data when a button has been pressed, but how do I update the datatable and pass the values in once the button has been pressed? I am trying to use fnServerData but with no avail.

Thanks

allan

Are you using fnFilter ? That's how to apply a filter in DataTables.

Please link to your page in future please, as required in the forum rules, so we can look at your code and understand the problem.

Allan

rpatel

I dont an actual webpage, im doing a project development which is not hosted! How would I use fnFilter? Would that be client side or server side?

var oTable = $('#Table').dataTable({
"bServerSide": true,
"sAjaxSource": "GetDaata",
"bProcessing": true,
"fnServerData": function (sSource, aoData, fnCallback) {
aoData.push({ "name": "item", "value": $('#query').val() });
$.getJSON(sSource, aoData, function (json) {
fnCallback(json)
});
}
});

Here you can see the code for my datatable. I want to pass selected values to my controller and return a new JSON Query with filtered results. I am having trouble trying to implment the passing bit, where it can get the values at anytime and pass this back.

rpatel

Hi I have added this code oTable.fnFilter('Abacus', 0); - This should filter results from the First Column with the text Abacus, however all the data is being shown instead of just rows with Abacus.

Can you explain why or If its wrong? Also is fnFilter Server or client Side?

Also in the Table Footer, do I add those textboxes mnaually or is there code that created this for me?

allan

Because you are using server-side processing, it is the server that has to do the filtering (that is the whole point of server-side processing). So your `GetDaata` script would do the filtering. fnFilter is a client-side function which sets the filter value and when DataTables makes the request to draw they able that filtering information is set to the server - see: http://datatables.net/usage/server-side

Allan

rpatel

Ahh ok, makes so much more sense. In which case how would I cann the fnServerData everytime an input/button is pressed so it reintilizes the data? Is there a special function to do this, or would I need to delete the entire table or table data and then get the data again using ajax?

allan

Use fnDraw .

Allan