1
0
Fork 0
mirror of https://github.com/koalyptus/TableFilter.git synced 2026-03-18 08:29:50 +01:00

highlight each cell of an active column

This commit is contained in:
koalyptus 2017-10-29 21:36:15 +11:00
commit 68adc86cbc
13 changed files with 56 additions and 18 deletions

View file

@ -27,6 +27,19 @@ export class MarkActiveColumns extends Feature {
this.headerCssClass = defaultsStr(config.header_css_class,
'activeHeader');
/**
* Css class for filtered (active) column cells
* @type {String}
*/
this.cellCssClass = defaultsStr(config.cell_css_class,
'activeCell');
/**
* Enable/disable column highlighting
* @type {Boolean}
*/
this.highlightColumn = Boolean(config.highlight_column);
/**
* Callback fired before a column is marked as filtered
* @type {Function}
@ -67,6 +80,14 @@ export class MarkActiveColumns extends Feature {
let tf = this.tf;
tf.eachCol((idx) => {
removeClass(tf.getHeaderElement(idx), this.headerCssClass);
if (this.highlightColumn) {
tf.dom()
.querySelectorAll(`tbody td:nth-child(${idx + 1})`)
.forEach((cell) => {
removeClass(cell, this.cellCssClass);
});
}
});
}
@ -75,14 +96,24 @@ export class MarkActiveColumns extends Feature {
* @param {Number} colIndex Column index
*/
markActiveColumn(colIndex) {
let header = this.tf.getHeaderElement(colIndex);
let tf = this.tf;
let header = tf.getHeaderElement(colIndex);
if (hasClass(header, this.headerCssClass)) {
return;
}
this.onBeforeActiveColumn(this, colIndex);
addClass(header, this.headerCssClass);
if (this.highlightColumn) {
tf.dom()
.querySelectorAll(`tbody td:nth-child(${colIndex + 1})`)
.forEach((cell) => {
addClass(cell, this.cellCssClass);
});
}
this.onAfterActiveColumn(this, colIndex);
}

View file

@ -260,7 +260,7 @@ export class PopupFilter extends Feature {
this.fltSpans[i] = icon;
this.fltIcons[i] = icon.firstChild;
},
// break condition function
// continue condition function
(i) => tf.getFilterType(i) === NONE
);
}

View file

@ -2054,17 +2054,21 @@ export class TableFilter {
}
/**
* Column iterator invoking break condition callback if any and then
* invoking the callback for each item
* Column iterator invoking continue and break condition callbacks if any
* then calling supplied callback for each item
* @param {Function} [fn=EMPTY_FN] callback
* @param {Function} [continueFn=EMPTY_FN] continue condition callback
* @param {Function} [breakFn=EMPTY_FN] break condition callback
*/
eachCol(fn = EMPTY_FN, breakFn = EMPTY_FN) {
eachCol(fn = EMPTY_FN, continueFn = EMPTY_FN, breakFn = EMPTY_FN) {
let len = this.getCellsNb(this.refRow);
for (let i = 0; i < len; i++) {
if (breakFn(i) === true) {
if (continueFn(i) === true) {
continue;
}
if (breakFn(i) === true) {
break;
}
fn(i);
}
}
@ -2953,7 +2957,7 @@ export class TableFilter {
let headerText = getFirstTextNode(header);
headers.push(headerText);
},
// break condition function
// continue condition function
(j) => {
if (excludeHiddenCols && this.hasExtension('colsVisibility')) {
return this.extension('colsVisibility').isColHidden(j);