1.06 Checklist filter

Property	Type	Description	Remarks	Example
sort_select	boolean|array	if set true, it will sort the options in all the drop-down filters. As an array it will only sort the filter options of specified columns (default - true)		var tfConfig = { sort_select: true }; // or var tfConfig = { sort_select: [1, 3] };
filter_options_sorter	object	specify the columns implementing a custom sorter sorting the filters options (only `select`, `multiple` and `checklist` filter types) (default - null)	It accepts a col and comparer properties, ie: filter_options_sorter: { col: [1, 5], comparer: [ function(a, b) { // compare function logic here, // return -1, 0 or positive number return 0; }, function(a, b) { return -1; } ] }	var tfConfig = { col: [0, 3], comparer: [ function(a, b) { return a - b; }, function(a, b) { return b - a; } ] }
sort_filter_options_asc	array	this property sorts a filter options in ascending order based on the column's data type. It accepts an array containing column indexes ([0, 2])		var tfConfig = { sort_filter_options_asc: [1, 2] }
sort_filter_options_desc	array	this property sorts a filter options in descending order based on the column's data type. It accepts an array containing column indexes ([0, 2])		var tfConfig = { sort_filter_options_desc: [1, 2] }
clear_filter_text	string|array	sets "Clear" text in drop-down list; (default - 'Clear')		var tfConfig = { clear_filter_text: ['Display all', '[Clear]'] }
div_checklist_css_class	string	defines the css class of div containing the checklist filter (default + 'div_checklist')		var tfConfig = { div_checklist_css_class: 'myClass' }
checklist_css_class	string	defines the css class of the checklist filter itself (default - 'flt_checklist')	<ul> tag	var tfConfig = { checklist_css_class: 'myClass' }
checklist_item_css_class	string	defines the css class of a checklist item (default - 'flt_checklist_item')	<li> tag	var tfConfig = { checklist_item_css_class: 'myClass' }
checklist_selected_item_css_class	string	defines the css class of a selected checklist item (default - 'flt_checklist_slc_item')		var tfConfig = { checklist_selected_item_css_class: 'myClass' }
checklist_item_disabled_css_class	string	defines the css class of a disabled checklist item (default - 'flt_checklist_item_disabled')		var tfConfig = { checklist_item_disabled_css_class: 'myClass' }
activate_checklist_text	string	text appearing in the checklist filter when load_filters_on_demand property is set true (default - 'Click to load data')		var tfConfig = { load_filters_on_demand: true, activate_checklist_text: "Click to activate filter" }
enable_checklist_reset_filter	boolean	if set false the 1st option is removed (default - true)		var tfConfig = { enable_checklist_reset_filter: false }
enable_empty_option	boolean	if set true, it will add the empty criteria option to drop-down filters (default - false)		var tfConfig = { enable_empty_option: true }
empty_text	string	defines the text for the empty criteria option (default * '(Empty)')		var tfConfig = { empty_text: '<Empty values>' }
enable_non_empty_option	boolean	if set true, it will add the non-empty criteria option to drop-down filters (default - false)		var tfConfig = { enable_non_empty_option: true }
non_empty_text	string	defines the text for the non-empty criteria option (default - '(Non empty)')		var tfConfig = { non_empty_text: '<Non-empty values>' }

Events

Assuming TableFilter is already instanciated:

var tf = new TableFilter('my-table-id');

Event	Description	Remarks	Example
before-populating-filter	Event emitted just before starting populating a filter	Subscribers receive the following parameters: tf - current TableFilter instance colIndex - index of the filter's column	tf.emitter.on(['before-populating-filter'], function(tf, colIndex){ console.log(tf, colIndex); });
after-populating-filter	Event emitted when the filter is populated	Subscribers receive the following parameters: tf - current TableFilter instance colIndex - index of the filter's column element - filter's DOM element	tf.emitter.on(['after-populating-filter'], function(tf, colIndex, element){ console.log(tf, colIndex, element); });
filter-focus	Event emitted when a filter receives focus	Subscribers receive the following parameters: tf - current TableFilter instance element - filter's DOM element	tf.emitter.on(['filter-focus'], function(tf, element){ console.log(tf, element); });