Capturing user clicks on column headers

Krishna

I have a use case, when the user applies a filter criteria, results get displayed on the datatable (sorting, server side processing turned on)

I would like to distinguish between a filter submission and user (for sorting) clicks on column headers.
Is there a property which is turned on only when the user clicks on column headers ?
I would be then able to capture this information server side and decide on the source of invocation.

allan

So you've got the filtering inputs in the header - is that correct? One option would be to have to rows in the header - one for the column names and one for the filtering inputs. Another would be to unbind the DataTables sort listener and then bind you own (possibly using the fnSortListener API method) which would do your own logic including the sorting if needed.

Allan

Krishna

I chose the later option ...
Tried unbinding the click on the header
var table = $('#table').dataTable(options);

$('#table > thead > tr > th').each(function(key, value) {
$(value).unbind('click.DT', function() {
console.log("unbound");
});
});

I can still click and sort on the headers.
I was looking for a sort event to unbind it but i could find the following
$(oSettings.oInstance).trigger('sort', oSettings);
but the above triggers after successful sorting

Thoughts where i am going wrong.

Krishna

Well here is how i ended up addressing it;
-- Bind to click.DT
-- if it gets originated from the header element (with visible sort style), publish an event to inform the subscribers listening to.

Before server invocation
-- bind to the above event that we published above
-- In the callback of event, massage information to the existing data that will be sent when xhr gets invoked

Thus when the user clicks on the filter, the custom event will not get triggered whereas clicking on the column header (only sortable ones) will invoke the same.