-
Notifications
You must be signed in to change notification settings - Fork 95
1.06 Checklist filter
koalyptus edited this page Jun 7, 2019
·
12 revisions
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 = { |
|
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>'
} |
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.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); }); |