mirror of
https://github.com/koalyptus/TableFilter.git
synced 2024-05-04 07:33:18 +02:00
linked filters refactor
This commit is contained in:
parent
5d4def11fc
commit
62a55c8d95
4
dist/starter.html
vendored
4
dist/starter.html
vendored
|
@ -1,10 +1,10 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>tablefilter v0.6.60 - Starter</title>
|
||||
<title>tablefilter v0.6.62 - Starter</title>
|
||||
</head>
|
||||
<body>
|
||||
<h1>tablefilter v0.6.60</h1>
|
||||
<h1>tablefilter v0.6.62</h1>
|
||||
|
||||
|
||||
|
||||
|
|
2
dist/tablefilter/tablefilter.js
vendored
2
dist/tablefilter/tablefilter.js
vendored
File diff suppressed because one or more lines are too long
2
dist/tablefilter/tablefilter.js.map
vendored
2
dist/tablefilter/tablefilter.js.map
vendored
File diff suppressed because one or more lines are too long
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "tablefilter",
|
||||
"version": "0.6.61",
|
||||
"version": "0.6.62",
|
||||
"description": "A Javascript library making HTML tables filterable and a bit more",
|
||||
"license": "MIT",
|
||||
"author": {
|
||||
|
|
|
@ -4,6 +4,7 @@ import {
|
|||
dateSortAsc, sortNumberStr, sortDateStr
|
||||
} from '../sort';
|
||||
import {isArray, isObj, isEmpty} from '../types';
|
||||
// import {createOpt} from '../dom';
|
||||
import {NUMBER, FORMATTED_NUMBER, DATE} from '../const';
|
||||
|
||||
/**
|
||||
|
@ -144,4 +145,16 @@ export class BaseDropdown extends Feature {
|
|||
|
||||
return false;
|
||||
}
|
||||
|
||||
/**
|
||||
* Refresh linked filters to offer only selected options
|
||||
*/
|
||||
linkFilters() {
|
||||
let tf = this.tf;
|
||||
if (!tf.linkedFilters || !tf.activeFilterId) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.refreshAll();
|
||||
}
|
||||
}
|
||||
|
|
|
@ -178,6 +178,8 @@ export class CheckList extends BaseDropdown {
|
|||
|
||||
this.emitter.on(['rows-changed'], () => this.refreshAll());
|
||||
|
||||
this.emitter.on(['after-filtering'], () => this.linkFilters());
|
||||
|
||||
/** @inherited */
|
||||
this.initialized = true;
|
||||
}
|
||||
|
@ -483,6 +485,10 @@ export class CheckList extends BaseDropdown {
|
|||
getValues(colIndex) {
|
||||
let tf = this.tf;
|
||||
let flt = tf.getFilterElement(colIndex);
|
||||
if (!flt) {
|
||||
return [];
|
||||
}
|
||||
|
||||
let fltAttr = flt.getAttribute('value');
|
||||
let values = isEmpty(fltAttr) ? '' : fltAttr;
|
||||
//removes last operator ||
|
||||
|
@ -506,6 +512,7 @@ export class CheckList extends BaseDropdown {
|
|||
(tf, colIndex, values) => this.selectOptions(colIndex, values)
|
||||
);
|
||||
this.emitter.off(['rows-changed'], () => this.refreshAll());
|
||||
this.emitter.off(['after-filtering'], () => this.linkFilters());
|
||||
|
||||
this.initialized = false;
|
||||
}
|
||||
|
|
|
@ -137,6 +137,8 @@ export class Dropdown extends BaseDropdown {
|
|||
);
|
||||
this.emitter.on(['rows-changed'], () => this.refreshAll());
|
||||
|
||||
this.emitter.on(['after-filtering'], () => this.linkFilters());
|
||||
|
||||
/** @inherited */
|
||||
this.initialized = true;
|
||||
}
|
||||
|
@ -368,6 +370,7 @@ export class Dropdown extends BaseDropdown {
|
|||
(tf, colIndex, values) => this.selectOptions(colIndex, values)
|
||||
);
|
||||
this.emitter.off(['rows-changed'], () => this.refreshAll());
|
||||
this.emitter.off(['after-filtering'], () => this.linkFilters());
|
||||
this.initialized = false;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
import {addEvt, cancelEvt, stopEvt, targetEvt, isKeyPressed} from './event';
|
||||
import {
|
||||
addClass, createElm, createOpt, elm, getText, getFirstTextNode,
|
||||
addClass, createElm/*, createOpt*/, elm, getText, getFirstTextNode,
|
||||
removeClass, tag
|
||||
} from './dom';
|
||||
import {contains, matchCase, rgxEsc, trim} from './string';
|
||||
|
@ -1064,11 +1064,6 @@ export class TableFilter {
|
|||
/* Load extensions */
|
||||
this.initExtensions();
|
||||
|
||||
// Subscribe to events
|
||||
if (this.linkedFilters) {
|
||||
this.emitter.on(['after-filtering'], () => this.linkFilters());
|
||||
}
|
||||
|
||||
this.initialized = true;
|
||||
|
||||
this.onFiltersLoaded(this);
|
||||
|
@ -1474,9 +1469,7 @@ export class TableFilter {
|
|||
if (this.hasExcludedRows) {
|
||||
emitter.off(['after-filtering'], () => this.setExcludeRows());
|
||||
}
|
||||
if (this.linkedFilters) {
|
||||
emitter.off(['after-filtering'], () => this.linkFilters());
|
||||
}
|
||||
|
||||
this.emitter.off(['filter-focus'],
|
||||
(tf, filter) => this.setActiveFilterId(filter.id));
|
||||
|
||||
|
@ -2495,15 +2488,8 @@ export class TableFilter {
|
|||
return;
|
||||
}
|
||||
|
||||
if (fltColType !== MULTIPLE && fltColType !== CHECKLIST) {
|
||||
if (this.loadFltOnDemand && !this.initialized) {
|
||||
this.emitter.emit('build-select-filter', this, index,
|
||||
this.linkedFilters, this.isExternalFlt());
|
||||
}
|
||||
slc.value = query;
|
||||
}
|
||||
//multiple selects
|
||||
else if (fltColType === MULTIPLE) {
|
||||
if (fltColType === MULTIPLE) {
|
||||
let values = isArray(query) ? query :
|
||||
query.split(' ' + this.orOperator + ' ');
|
||||
|
||||
|
@ -2530,6 +2516,13 @@ export class TableFilter {
|
|||
|
||||
this.emitter.emit('select-checklist-options', this, index, values);
|
||||
}
|
||||
else {
|
||||
if (this.loadFltOnDemand && !this.initialized) {
|
||||
this.emitter.emit('build-select-filter', this, index,
|
||||
this.linkedFilters, this.isExternalFlt());
|
||||
}
|
||||
slc.value = query;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -2701,43 +2694,6 @@ export class TableFilter {
|
|||
this.setActiveFilterId(this.getFilterId(colIndex));
|
||||
}
|
||||
|
||||
/**
|
||||
* Refresh the filters subject to linking ('select', 'multiple',
|
||||
* 'checklist' type)
|
||||
*/
|
||||
linkFilters() {
|
||||
if (!this.linkedFilters || !this.activeFilterId) {
|
||||
return;
|
||||
}
|
||||
let slcA1 = this.getFiltersByType(SELECT, true),
|
||||
slcA2 = this.getFiltersByType(MULTIPLE, true),
|
||||
slcA3 = this.getFiltersByType(CHECKLIST, true),
|
||||
slcIndex = slcA1.concat(slcA2);
|
||||
slcIndex = slcIndex.concat(slcA3);
|
||||
|
||||
slcIndex.forEach((colIdx) => {
|
||||
let curSlc = this.getFilterElement(colIdx);
|
||||
let slcSelectedValue = this.getFilterValue(colIdx);
|
||||
|
||||
//1st option needs to be inserted
|
||||
if (this.loadFltOnDemand) {
|
||||
let opt0 = createOpt(this.getClearFilterText(colIdx), '');
|
||||
curSlc.innerHTML = '';
|
||||
curSlc.appendChild(opt0);
|
||||
}
|
||||
|
||||
if (slcA3.indexOf(colIdx) !== -1) {
|
||||
this.emitter.emit('build-checklist-filter', this, colIdx,
|
||||
true);
|
||||
} else {
|
||||
this.emitter.emit('build-select-filter', this, colIdx,
|
||||
true);
|
||||
}
|
||||
|
||||
this.setFilterValue(colIdx, slcSelectedValue);
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Determine if passed filter column implements exact query match
|
||||
* @param {Number} colIndex Column index
|
||||
|
|
|
@ -11,7 +11,7 @@
|
|||
});
|
||||
|
||||
var ct = 0;
|
||||
tf.emitter.on(['build-checklist-filter'], function() {
|
||||
tf.emitter.on(['after-filtering'], function() {
|
||||
ct++;
|
||||
});
|
||||
|
||||
|
@ -31,7 +31,7 @@
|
|||
tf.clearFilters();
|
||||
|
||||
deepEqual(ct, 2,
|
||||
'build-checklist-filter event emitted after filtering');
|
||||
'after-filtering event emitted after filtering');
|
||||
tf.onAfterFilter = null;
|
||||
tf.destroy();
|
||||
tf = null;
|
||||
|
|
Loading…
Reference in a new issue