Flexigrid
You can create a form (e.g. call it searchForm
) and then serialize this data and pass it into the Flexigrid search parameters.
You can then add form data to a Flexigrid implementation on the click of the button:
$(function () {
$('#btnSearch').click(function () {
addFormData();
// Reload the grid from the URL, passing in search parameters from addFormData
$('#flexGrid').flexOptions({ url: '/search/here/' }).flexReload();
});
});
And the addFormData
function just serializes the data from the form and adds it to the parameters of the Flexigrid call back to the server:
function addFormData() {
//Retrieve all input data from the searchForm
var allSearchParams = $('#searchform').serializeArray();
//Add the parameters to Flexigrid, so when it reloads, it will use them to filter the data
$("#flexGrid").flexOptions({ params: allSearchParams });
return true;
}
DataTables
DataTables has handy plugins like the Column Filter which has server-side filtering to do all this work for you, or I would recommend reading up on DataTables server-side processing.