-
Notifications
You must be signed in to change notification settings - Fork 95
1.05 Drop down filter
koalyptus edited this page Jun 7, 2019
·
12 revisions
Property | Type | Description | Remarks | Example |
---|---|---|---|---|
clear_filter_text | string or array | sets "Clear" text in drop-down list; (default - 'Clear') | var tfConfig = { clear_filter_text: ['Display all', '[Clear]']
} |
|
enable_slc_reset_filter | boolean | if set false the 1st option is removed (default - true) | var tfConfig = { enable_slc_reset_filter: false
} |
|
on_change | boolean | filters the table as you change the value of a drop-down list (default * true) | var tfConfig = { on_change: false } |
|
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: 'select', col_3: 'checklist', filter_options_sorter: { 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] } |
|
multiple_slc_tooltip | string | tooltip text appearing on multiple drop-down filters (default - 'Use Ctrl key for multiple selections') | var tfConfig = { |
|
load_filters_on_demand | boolean | if set true, drop-down filters will be populated at first use only | This feature improves performances with large data tables.
This option was called fill_slc_on_demand in previous
HTML Table Filter Generator library.
|
var tfConfig = { load_filters_on_demand: true } |
activate_slc_tooltip | string | tooltip text appearing on drop-downs when load_filters_on_demand property is set true (default - 'Click to activate') | This property is used only by IE to inform users to click on filter in order to activate it. | var tfConfig = { |
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>'
} |
Assuming TableFilter
is already instantiated:
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.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.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.emitter.on(['filter-focus'], function(tf, element){ console.log(tf, element); }); |