deblan-mirror/TableFilter
1
0
Fork 0
mirror of https://github.com/koalyptus/TableFilter.git synced 2024-06-07 08:22:26 +02:00
Code Issues Releases Wiki Activity

Merge pull request #103 from koalyptus/issue-98-refactor-reset-logic

Browse source 
Issue 98 refactor reset logic
This commit is contained in:
koalyptus 2016-01-17 18:48:38 +11:00
parent 6b14415976 db80c7c381
commit 885b957d31
27 changed files with 378 additions and 371 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
.jshintrc
View file

@ -11,7 +11,7 @@
"trailing": true,
"quotmark": "single",
"immed": true,
"maxstatements": 178,
"maxstatements": 172,
"maxdepth": 7,
"maxcomplexity": 87
"maxcomplexity": 85
}

4
dist/starter.html vendored
View file

@ -1,10 +1,10 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>tablefilter v0.1.5 - Starter</title>
<title>tablefilter v0.1.6 - Starter</title>
</head>
<body>
<h1>tablefilter v0.1.5</h1>
<h1>tablefilter v0.1.6</h1>

4
dist/tablefilter/style/colsVisibility.css vendored
View file

@ -1,6 +1,6 @@
/**
* tablefilter v0.1.5 by Max Guglielmi
* build date: 2016-01-16T01:24:44.160Z
* tablefilter v0.1.6 by Max Guglielmi
* build date: 2016-01-17T07:23:14.025Z
* MIT License
*/
span.colVisSpan{text-align:left;}span.colVisSpan a.colVis{display:inline-block;padding:7px 5px 0;font-size:inherit;font-weight:inherit;vertical-align:top}div.colVisCont{position:relative;background:#fff;-webkit-box-shadow:3px 3px 2px #888;-moz-box-shadow:3px 3px 2px #888;box-shadow:3px 3px 2px #888;position:absolute;display:none;border:1px solid #ccc;height:auto;width:250px;background-color:#fff;margin:35px 0 0 -100px;z-index:10000;padding:10px 10px 10px 10px;text-align:left;font-size:12px;}div.colVisCont:after,div.colVisCont:before{bottom:100%;left:50%;border:solid transparent;content:" ";height:0;width:0;position:absolute;pointer-events:none}div.colVisCont:after{border-color:rgba(255,255,255,0);border-bottom-color:#fff;border-width:10px;margin-left:-10px}div.colVisCont:before{border-color:rgba(255,255,255,0);border-bottom-color:#ccc;border-width:12px;margin-left:-12px}div.colVisCont p{margin:6px auto 6px auto}div.colVisCont a.colVis{display:initial;font-weight:inherit}ul.cols_checklist{padding:0;margin:0;list-style:none;}ul.cols_checklist label{display:block}ul.cols_checklist input{vertical-align:middle;margin:2px 5px 2px 1px}li.cols_checklist_item{padding:4px;margin:0;}li.cols_checklist_item:hover{background-color:#335ea8;color:#fff}.cols_checklist_slc_item{background-color:#335ea8;color:#fff}

4
dist/tablefilter/style/filtersVisibility.css vendored
View file

@ -1,6 +1,6 @@
/**
* tablefilter v0.1.5 by Max Guglielmi
* build date: 2016-01-16T01:24:44.160Z
* tablefilter v0.1.6 by Max Guglielmi
* build date: 2016-01-17T07:23:14.025Z
* MIT License
*/
span.expClpFlt a.btnExpClpFlt{width:35px;height:35px;display:inline-block;}span.expClpFlt a.btnExpClpFlt:hover{background-color:#f4f4f4}span.expClpFlt img{padding:8px 11px 11px 11px}

4
dist/tablefilter/style/tablefilter.css vendored
View file

@ -1,6 +1,6 @@
/**
* tablefilter v0.1.5 by Max Guglielmi
* build date: 2016-01-16T01:24:44.160Z
* tablefilter v0.1.6 by Max Guglielmi
* build date: 2016-01-17T07:23:14.025Z
* MIT License
*/
.activeHeader{background-color:#66afe9 !important;color:#fff !important}

4
dist/tablefilter/style/themes/default/default.css vendored
View file

@ -1,6 +1,6 @@
/**
* tablefilter v0.1.5 by Max Guglielmi
* build date: 2016-01-16T01:24:44.160Z
* tablefilter v0.1.6 by Max Guglielmi
* build date: 2016-01-17T07:23:14.025Z
* MIT License
*/
table.TF{border-left:1px solid #ccc !important;border-top:none !important;border-right:none !important;border-bottom:none !important;}table.TF th{background:#ebecee url("images/bg_th.jpg") left top repeat-x !important;border-bottom:1px solid #d0d0d0 !important;border-right:1px solid #d0d0d0 !important;border-left:1px solid #fff !important;border-top:1px solid #fff !important;color:#333 !important}table.TF td{border-bottom:1px dotted #999 !important;padding:5px !important}.fltrow{background-color:#ebecee !important;}.fltrow th,.fltrow td{border-bottom:1px dotted #666 !important;padding:1px 3px 1px 3px !important}.flt,select.flt,select.flt_multi,.flt_s,.single_flt,.div_checklist{border:1px solid #999 !important}input.flt{width:99% !important}.inf{height:$min-height;background:#d7d7d7 url("images/bg_infDiv.jpg") 0 0 repeat-x !important}input.reset{background:transparent url("images/btn_eraser.gif") center center no-repeat !important}.helpBtn:hover{background-color:transparent}.nextPage{background:transparent url("images/btn_next_page.gif") center center no-repeat !important;}.nextPage:hover{background:transparent url("images/btn_over_next_page.gif") center center no-repeat !important}.previousPage{background:transparent url("images/btn_previous_page.gif") center center no-repeat !important;}.previousPage:hover{background:transparent url("images/btn_over_previous_page.gif") center center no-repeat !important}.firstPage{background:transparent url("images/btn_first_page.gif") center center no-repeat !important;}.firstPage:hover{background:transparent url("images/btn_over_first_page.gif") center center no-repeat !important}.lastPage{background:transparent url("images/btn_last_page.gif") center center no-repeat !important;}.lastPage:hover{background:transparent url("images/btn_over_last_page.gif") center center no-repeat !important}div.grd_Cont{background-color:#ebecee !important;border:1px solid #ccc !important;padding:0 !important;}div.grd_Cont .even{background-color:#fff}div.grd_Cont .odd{background-color:#d5d5d5}div.grd_headTblCont{background-color:#ebecee !important;border-bottom:none !important;}div.grd_headTblCont table{border-right:none !important}div.grd_tblCont table th,div.grd_headTblCont table th,div.grd_headTblCont table td{background:#ebecee url("images/bg_th.jpg") left top repeat-x !important;border-bottom:1px solid #d0d0d0 !important;border-right:1px solid #d0d0d0 !important;border-left:1px solid #fff !important;border-top:1px solid #fff !important}div.grd_tblCont table td{border-bottom:1px solid #999 !important}.grd_inf{background:#d7d7d7 url("images/bg_infDiv.jpg") 0 0 repeat-x !important;border-top:1px solid #d0d0d0 !important}.loader{border:1px solid #999}.defaultLoader{width:32px;height:32px;background:transparent url("images/img_loading.gif") 0 0 no-repeat !important}.even{background-color:#fff}.odd{background-color:#d5d5d5}span.expClpFlt a.btnExpClpFlt:hover{background-color:transparent !important}

4
dist/tablefilter/style/themes/mytheme/mytheme.css vendored
View file

@ -1,6 +1,6 @@
/**
* tablefilter v0.1.5 by Max Guglielmi
* build date: 2016-01-16T01:24:44.160Z
* tablefilter v0.1.6 by Max Guglielmi
* build date: 2016-01-17T07:23:14.025Z
* MIT License
*/
table.TF{border-left:1px dotted #81963b !important;border-top:none !important;border-right:0 !important;border-bottom:none !important;}table.TF th{background:#39424b url("images/bg_headers.jpg") left top repeat-x !important;border-bottom:0 !important;border-right:1px dotted #d0d0d0 !important;border-left:0 !important;border-top:0 !important;color:#fff !important}table.TF td{border-bottom:1px dotted #81963b;border-right:1px dotted #81963b;padding:5px !important}.fltrow{background-color:#81963b !important;}.fltrow th,.fltrow td{border-bottom:1px dotted #39424b !important;border-right:1px dotted #fff !important;border-left:0 !important;border-top:0 !important;padding:1px 3px 1px 3px !important}.flt,select.flt,select.flt_multi,.flt_s,.single_flt,.div_checklist{border:1px solid #687830 !important}input.flt{width:99% !important}.inf{background:#d8d8d8;height:$min-height}input.reset{width:53px;background:transparent url("images/btn_filter.png") center center no-repeat !important}.helpBtn:hover{background-color:transparent}.nextPage{background:transparent url("images/btn_next_page.gif") center center no-repeat !important}.previousPage{background:transparent url("images/btn_previous_page.gif") center center no-repeat !important}.firstPage{background:transparent url("images/btn_first_page.gif") center center no-repeat !important}.lastPage{background:transparent url("images/btn_last_page.gif") center center no-repeat !important}div.grd_Cont{background:#81963b url("images/bg_headers.jpg") left top repeat-x !important;border:1px solid #ccc !important;padding:0 1px 1px 1px !important;}div.grd_Cont .even{background-color:#bccd83}div.grd_Cont .odd{background-color:#fff}div.grd_headTblCont{background-color:#ebecee !important;border-bottom:none !important}div.grd_tblCont table{border-right:none !important;}div.grd_tblCont table td{border-bottom:1px dotted #81963b;border-right:1px dotted #81963b}div.grd_tblCont table th,div.grd_headTblCont table th{background:transparent url("images/bg_headers.jpg") 0 0 repeat-x !important;border-bottom:0 !important;border-right:1px dotted #d0d0d0 !important;border-left:0 !important;border-top:0 !important;padding:0 4px 0 4px !important;color:#fff !important;height:35px !important}div.grd_headTblCont table td{border-bottom:1px dotted #39424b !important;border-right:1px dotted #fff !important;border-left:0 !important;border-top:0 !important;background-color:#81963b !important;padding:1px 3px 1px 3px !important}.grd_inf{background-color:#d8d8d8;border-top:1px solid #d0d0d0 !important}.loader{border:0 !important;background:#81963b !important}.defaultLoader{width:32px;height:32px;background:transparent url("images/img_loading.gif") 0 0 no-repeat !important}.even{background-color:#bccd83}.odd{background-color:#fff}span.expClpFlt a.btnExpClpFlt:hover{background-color:transparent !important}

4
dist/tablefilter/style/themes/skyblue/skyblue.css vendored
View file

@ -1,6 +1,6 @@
/**
* tablefilter v0.1.5 by Max Guglielmi
* build date: 2016-01-16T01:24:44.160Z
* tablefilter v0.1.6 by Max Guglielmi
* build date: 2016-01-17T07:23:14.025Z
* MIT License
*/
table.TF{padding:0;color:#000;border-right:1px solid #a4bed4;border-top:1px solid #a4bed4;border-left:1px solid #a4bed4;border-bottom:0;}table.TF th{margin:0;color:inherit;background:#d1e5fe url("images/bg_skyblue.gif") 0 0 repeat-x;border-color:#fdfdfd #a4bed4 #a4bed4 #fdfdfd;border-width:1px;border-style:solid}table.TF td{margin:0;padding:5px;color:inherit;border-bottom:1px solid #a4bed4;border-left:0;border-top:0;border-right:0}.fltrow{background-color:#d1e5fe !important;}.fltrow th,.fltrow td{padding:1px 3px 1px 3px !important}.flt,select.flt,select.flt_multi,.flt_s,.single_flt,.div_checklist{border:1px solid #a4bed4 !important}input.flt{width:99% !important}.inf{background-color:#e3efff !important;border:1px solid #a4bed4;height:$min-height;color:#004a6f}div.tot,div.status{border-right:0 !important}.helpBtn:hover{background-color:transparent}input.reset{background:transparent url("images/icn_clear_filters.png") center center no-repeat !important}.nextPage{background:transparent url("images/btn_next_page.gif") center center no-repeat !important;border:1px solid transparent !important;}.nextPage:hover{background:#ffe4ab url("images/btn_next_page.gif") center center no-repeat !important;border:1px solid #ffb552 !important}.previousPage{background:transparent url("images/btn_prev_page.gif") center center no-repeat !important;border:1px solid transparent !important;}.previousPage:hover{background:#ffe4ab url("images/btn_prev_page.gif") center center no-repeat !important;border:1px solid #ffb552 !important}.firstPage{background:transparent url("images/btn_first_page.gif") center center no-repeat !important;border:1px solid transparent !important;}.firstPage:hover{background:#ffe4ab url("images/btn_first_page.gif") center center no-repeat !important;border:1px solid #ffb552 !important}.lastPage{background:transparent url("images/btn_last_page.gif") center center no-repeat !important;border:1px solid transparent !important;}.lastPage:hover{background:#ffe4ab url("images/btn_last_page.gif") center center no-repeat !important;border:1px solid #ffb552 !important}.activeHeader{background:#ffe4ab !important;border:1px solid #ffb552 !important;color:inherit !important}div.grd_Cont{background-color:#d9eaed !important;border:1px solid #9cc !important;padding:0 !important;}div.grd_Cont .even{background-color:#fff}div.grd_Cont .odd{background-color:#e3efff}div.grd_headTblCont{background-color:#d9eaed !important;border-bottom:none !important}div.grd_tblCont table{border-right:none !important}div.grd_tblCont table th,div.grd_headTblCont table th,div.grd_headTblCont table td{background:#d9eaed url("images/bg_skyblue.gif") left top repeat-x;border-bottom:1px solid #a4bed4;border-right:1px solid #a4bed4 !important;border-left:1px solid #fff !important;border-top:1px solid #fff !important}div.grd_tblCont table td{border-bottom:1px solid #a4bed4 !important;border-right:0 !important;border-left:0 !important;border-top:0 !important}.grd_inf{background-color:#cce2fe;color:#004a6f;border-top:1px solid #9cc !important;}.grd_inf a{text-decoration:none;font-weight:bold}.loader{background-color:#2d8eef;border:1px solid #cce2fe;border-radius:5px}.even{background-color:#fff}.odd{background-color:#e3efff}span.expClpFlt a.btnExpClpFlt:hover{background-color:transparent !important}.ezActiveRow{background-color:#ffdc61 !important;color:inherit}.ezSelectedRow{background-color:#ffe4ab !important;color:inherit}.ezActiveCell{background-color:#fff !important;color:#000 !important;font-weight:bold}.ezETSelectedCell{background-color:#fff !important;font-weight:bold;color:#000 !important}

12
dist/tablefilter/tablefilter.js vendored
View file

File diff suppressed because one or more lines are too long

8
dist/tablefilter/tf-1.js vendored
View file

File diff suppressed because one or more lines are too long

2
package.json
View file

@ -1,6 +1,6 @@
{
"name": "tablefilter",
"version": "0.1.5",
"version": "0.1.6",
"description": "A Javascript library making HTML tables filterable and a bit more",
"license": "MIT",
"author": {

24
src/extensions/advancedGrid/adapterEzEditTable.js
View file

@ -26,6 +26,7 @@ export default class AdapterEzEditTable {
this._ezEditTable = null;
this.cfg = cfg;
this.tf = tf;
this.emitter = tf.emitter;
}
/**
@ -43,6 +44,10 @@ export default class AdapterEzEditTable {
if(this.loadStylesheet && !tf.isImported(this.stylesheet, 'link')){
tf.import(this.stylesheetName, this.stylesheet, null, 'link');
}
// TODO: hack to prevent ezEditTable enter key event hijaking.
// Needs to be fixed in the vendor's library
this.emitter.on(['filter-focus', 'filter-blur'], ()=> this.toggle());
}
/**
@ -358,6 +363,23 @@ export default class AdapterEzEditTable {
}
}
/**
* Toggle behaviour
*/
toggle(){
var ezEditTable = this._ezEditTable;
if(ezEditTable.editable){
ezEditTable.Editable.Remove();
} else {
ezEditTable.Editable.Set();
}
if(ezEditTable.selection){
ezEditTable.Selection.Remove();
} else {
ezEditTable.Selection.Set();
}
}
/**
* Remove advanced grid
*/
@ -372,6 +394,8 @@ export default class AdapterEzEditTable {
ezEditTable.Editable.Remove();
}
}
this.emitter.off(['filter-focus', 'filter-blur'], ()=> this.toggle());
this.initialized = false;
}
}

2
src/extensions/colOps/colOps.js
View file

@ -46,7 +46,7 @@ export default class ColOps{
*/
calc() {
var tf = this.tf;
if(!tf.isFirstLoad && !tf.hasGrid()){
if(!tf.hasGrid()){
return;
}

2
src/modules/alternateRows.js
View file

@ -112,7 +112,7 @@ export class AlternateRows extends Feature {
if(!this.initialized){
return;
}
for(var i=this.tf.refRow; i<this.tf.nbRows; i++){
for(var i=0; i<this.tf.nbRows; i++){
this.removeRowBg(i);
}

37
src/modules/checkList.js
View file

@ -47,12 +47,12 @@ export class CheckList extends Feature{
this.excludedOpts = null;
}
// TODO: move event here
onChange(evt){
let elm = evt.target;
this.tf.activeFilterId = elm.getAttribute('id');
this.tf.activeFlt = Dom.id(this.tf.activeFilterId);
this.tf.Evt.onSlcChange.call(this.tf, evt);
let tf = this.tf;
tf.activeFilterId = elm.getAttribute('id');
tf.activeFlt = Dom.id(tf.activeFilterId);
tf.filter();
}
optionClick(evt){
@ -104,6 +104,11 @@ export class CheckList extends Feature{
divCont.appendChild(Dom.text(this.activateCheckListTxt));
}
this.emitter.on(
['build-checklist-filter'],
(tf, colIndex, isExternal)=> this.build(colIndex, isExternal)
);
this.initialized = true;
}
@ -132,7 +137,7 @@ export class CheckList extends Feature{
let ul = Dom.create(
'ul', ['id', tf.fltIds[colIndex]], ['colIndex', colIndex]);
ul.className = this.checkListCssClass;
Event.add(ul, 'change', (evt) => this.onChange(evt));
Event.add(ul, 'change', (evt)=> this.onChange(evt));
let rows = tf.tbl.rows;
this.isCustom = tf.isCustomOptions(colIndex);
@ -187,8 +192,7 @@ export class CheckList extends Feature{
}
if(!Arr.has(filteredCol, cell_string, tf.matchCase) &&
!Arr.has(this.excludedOpts,
cell_string, tf.matchCase) &&
!tf.isFirstLoad){
cell_string, tf.matchCase)){
this.excludedOpts.push(cell_data);
}
}
@ -256,7 +260,7 @@ export class CheckList extends Feature{
}//in case there are alphanumeric values
}
this.addChecks(colIndex, ul, tf.separator);
this.addChecks(colIndex, ul);
if(tf.loadFltOnDemand){
flt.innerHTML = '';
@ -289,7 +293,7 @@ export class CheckList extends Feature{
li.check.disabled = true;
li.disabled = true;
} else {
Event.add(li.check, 'click', (evt) => this.optionClick(evt));
Event.add(li.check, 'click', (evt)=> this.optionClick(evt));
}
ul.appendChild(li);
@ -313,9 +317,7 @@ export class CheckList extends Feature{
li0.className = this.checkListItemCssClass;
ul.appendChild(li0);
Event.add(li0.check, 'click', (evt) => {
this.optionClick(evt);
});
Event.add(li0.check, 'click', (evt)=> this.optionClick(evt));
if(!this.enableCheckListResetFilter){
li0.style.display = 'none';
@ -326,7 +328,7 @@ export class CheckList extends Feature{
tf.fltIds[colIndex]+'_1', tf.emOperator, tf.emptyText);
li1.className = this.checkListItemCssClass;
ul.appendChild(li1);
Event.add(li1.check, 'click', (evt) => this.optionClick(evt));
Event.add(li1.check, 'click', (evt)=> this.optionClick(evt));
chkCt++;
}
@ -338,7 +340,7 @@ export class CheckList extends Feature{
);
li2.className = this.checkListItemCssClass;
ul.appendChild(li2);
Event.add(li2.check, 'click', (evt) => this.optionClick(evt));
Event.add(li2.check, 'click', (evt)=> this.optionClick(evt));
chkCt++;
}
return chkCt;
@ -426,5 +428,10 @@ export class CheckList extends Feature{
}
}
destroy(){}
destroy(){
this.emitter.off(
['build-checklist-filter'],
(tf, colIndex, isExternal)=> this.build(colIndex, isExternal)
);
}
}

47
src/modules/dropdown.js
View file

@ -36,6 +36,25 @@ export class Dropdown extends Feature{
this.slcInnerHtml = null;
}
onSlcFocus(e) {
let elm = Event.target(e);
let tf = this.tf;
tf.activeFilterId = elm.getAttribute('id');
tf.activeFlt = Dom.id(tf.activeFilterId);
// select is populated when element has focus
if(tf.loadFltOnDemand && elm.getAttribute('filled') === '0'){
let ct = elm.getAttribute('ct');
this.build(ct);
}
this.emitter.emit('filter-focus', tf, this);
}
onSlcChange() {
if(this.tf.onSlcChange){
this.tf.filter();
}
}
/**
* Initialize drop-down filter
* @param {Number} colIndex Column index
@ -78,9 +97,14 @@ export class Dropdown extends Feature{
slc.appendChild(opt0);
}
Event.add(slc, 'keypress', tf.Evt.detectKey.bind(tf));
Event.add(slc, 'change', tf.Evt.onSlcChange.bind(tf));
Event.add(slc, 'focus', tf.Evt.onSlcFocus.bind(tf));
Event.add(slc, 'change', ()=> this.onSlcChange());
Event.add(slc, 'focus', (e)=> this.onSlcFocus(e));
this.emitter.on(
['build-select-filter'],
(tf, colIndex, isLinked, isExternal)=>
this.build(colIndex, isLinked, isExternal)
);
this.initialized = true;
}
@ -88,7 +112,7 @@ export class Dropdown extends Feature{
/**
* Build drop-down filter UI
* @param {Number} colIndex Column index
* @param {Boolean} isLinked Enable linked refresh behaviour
* @param {Boolean} isLinked Enable linked refresh behaviour
* @param {Boolean} isExternal Render in external container
* @param {String} extSlcId External container id
*/
@ -173,8 +197,7 @@ export class Dropdown extends Feature{
}
if(!Arr.has(filteredCol, cell_string, matchCase) &&
!Arr.has(
excludedOpts, cell_string, matchCase) &&
!this.isFirstLoad){
excludedOpts, cell_string, matchCase)){
excludedOpts.push(cell_data);
}
}
@ -254,10 +277,8 @@ export class Dropdown extends Feature{
* @param {Object} slc Select Dom element
* @param {Boolean} isLinked Enable linked refresh behaviour
* @param {Array} excludedOpts Array of excluded options
* @param {Array} fltsValues Collection of persisted filter values
* @param {Array} fltArr Collection of persisted filter values
*/
addOptions(colIndex, slc, isLinked, excludedOpts/*, fltsValues, fltArr*/){
addOptions(colIndex, slc, isLinked, excludedOpts){
let tf = this.tf,
fillMethod = Str.lower(this.slcFillingMethod),
slcValue = slc.value;
@ -342,5 +363,11 @@ export class Dropdown extends Feature{
return slc;
}
destroy(){}
destroy(){
this.emitter.off(
['build-select-filter'],
(colIndex, isLinked, isExternal)=>
this.build(colIndex, isLinked, isExternal)
);
}
}

2
src/modules/gridLayout.js
View file

@ -330,7 +330,7 @@ export class GridLayout extends Feature{
tbl.outerHTML = this.sourceTblHtml;
//needed to keep reference of table element for future usage
this.tf.tbl = t;
this.tf.tbl = Dom.id(tf.id);
this.initialized = false;
}

10
src/modules/highlightKeywords.js
View file

@ -18,7 +18,10 @@ export class HighlightKeyword{
}
init(){
this.emitter.on(['before-filtering'], ()=> this.unhighlightAll());
this.emitter.on(
['before-filtering', 'destroy'],
()=> this.unhighlightAll()
);
}
/**
@ -112,6 +115,9 @@ export class HighlightKeyword{
}
destroy(){
this.emitter.off(['before-filtering'], ()=> this.unhighlightAll());
this.emitter.off(
['before-filtering', 'destroy'],
()=> this.unhighlightAll()
);
}
}

7
src/modules/paging.js
View file

@ -346,12 +346,12 @@ export class Paging extends Feature{
*/
reset(filterTable=false){
var tf = this.tf;
if(!tf.hasGrid() || this.isEnabled()){
if(this.isEnabled()){
return;
}
this.enable();
this.init();
tf.resetValues();
// tf.resetValues();
if(filterTable){
tf.filter();
}
@ -497,9 +497,6 @@ export class Paging extends Feature{
var tf = this.tf;
var evt = this.evt;
if(!tf.hasGrid() && !tf.isFirstLoad){
return;
}
if(this.resultsPerPageSlc || !this.resultsPerPage){
return;
}

4
src/modules/statusBar.js
View file

@ -178,7 +178,9 @@ export class StatusBar extends Feature{
let emitter = this.emitter;
this.statusBarDiv.innerHTML = '';
Dom.remove(this.statusBarDiv);
if(!this.statusBarTgtId){
Dom.remove(this.statusBarDiv);
}
this.statusBarSpan = null;
this.statusBarSpanText = null;
this.statusBarDiv = null;

2
src/modules/store.js
View file

@ -44,7 +44,7 @@ export class Store{
fltValues.push(value);
}
//adds array size
fltValues.push(tf.fltIds.length);
//fltValues.push(tf.fltIds.length);
//writes cookie
Cookie.write(

410
src/tablefilter.js
View file

@ -123,8 +123,6 @@ export class TableFilter {
this.validRowsIndex = [];
//stores filters row element
this.fltGridEl = null;
//is first load boolean
this.isFirstLoad = true;
//container div for paging elements, reset btn etc.
this.infDiv = null;
//div for rows counter
@ -472,70 +470,20 @@ export class TableFilter {
this.isUserTyping = false;
global.clearInterval(this.autoFilterTimer);
}
// TODO: hack to prevent ezEditTable enter key event hijaking.
// Needs to be fixed in the vendor's library
if(this.hasExtension('advancedGrid')){
var advGrid = this.extension('advancedGrid');
var ezEditTable = advGrid._ezEditTable;
if(advGrid.cfg.editable){
ezEditTable.Editable.Set();
}
if(advGrid.cfg.selection){
ezEditTable.Selection.Set();
}
}
this.emitter.emit('filter-blur', this);
},
// set focused text-box filter as active
onInpFocus(e) {
let elm = Event.target(e);
this.activeFilterId = elm.getAttribute('id');
this.activeFlt = Dom.id(this.activeFilterId);
if(this.popupFilters){
Event.cancel(e);
Event.stop(e);
}
// TODO: hack to prevent ezEditTable enter key event hijaking.
// Needs to be fixed in the vendor's library
if(this.hasExtension('advancedGrid')){
var advGrid = this.extension('advancedGrid');
var ezEditTable = advGrid._ezEditTable;
if(advGrid.cfg.editable){
ezEditTable.Editable.Remove();
}
if(advGrid.cfg.selection){
ezEditTable.Selection.Remove();
}
}
},
// set focused drop-down filter as active
onSlcFocus(e) {
// let _ev = e || global.event;
let elm = Event.target(e);
this.activeFilterId = elm.getAttribute('id');
this.activeFlt = Dom.id(this.activeFilterId);
// select is populated when element has focus
if(this.loadFltOnDemand && elm.getAttribute('filled') === '0'){
let ct = elm.getAttribute('ct');
this.Mod.dropdown.build(ct);
}
if(this.popupFilters){
Event.cancel(e);
Event.stop(e);
}
},
// filter columns on drop-down filter change
onSlcChange(e) {
if(!this.activeFlt){ return; }
if(this.popupFilters){ Event.stop(e); }
if(this.onSlcChange){ this.filter(); }
this.emitter.emit('filter-focus', this);
}
};
}
/**
* Initialise filtering grid bar behaviours and layout
*
* TODO: decompose in smaller methods
* Initialise features and layout
*/
init(){
if(this._hasGrid){
@ -554,12 +502,16 @@ export class TableFilter {
if(this.rememberGridValues || this.rememberPageNb ||
this.rememberPageLen){
Mod.store = new Store(this);
if(!Mod.store){
Mod.store = new Store(this);
}
Mod.store.init();
}
if(this.gridLayout){
Mod.gridLayout = new GridLayout(this);
if(!Mod.gridLayout){
Mod.gridLayout = new GridLayout(this);
}
Mod.gridLayout.init();
}
@ -586,63 +538,58 @@ export class TableFilter {
if(!this.fltGrid){
this._initNoFilters();
} else {
if(this.isFirstLoad){
let fltrow = this._insertFiltersRow();
let fltrow = this._insertFiltersRow();
this.nbFilterableRows = this.getRowsNb();
this.nbVisibleRows = this.nbFilterableRows;
this.nbRows = this.tbl.rows.length;
this.nbFilterableRows = this.getRowsNb();
this.nbVisibleRows = this.nbFilterableRows;
this.nbRows = this.tbl.rows.length;
// Generate filters
for(let i=0; i<n; i++){
this.emitter.emit('before-filter-init', this, i);
// Generate filters
for(let i=0; i<n; i++){
this.emitter.emit('before-filter-init', this, i);
let fltcell = Dom.create(this.fltCellTag),
col = this.getFilterType(i);
let fltcell = Dom.create(this.fltCellTag),
col = this.getFilterType(i);
if(this.singleSearchFlt){
fltcell.colSpan = this.nbCells;
if(this.singleSearchFlt){
fltcell.colSpan = this.nbCells;
}
if(!this.gridLayout){
fltrow.appendChild(fltcell);
}
inpclass = (i==n-1 && this.displayBtn) ?
this.fltSmallCssClass : this.fltCssClass;
//only 1 input for single search
if(this.singleSearchFlt){
col = this.fltTypeInp;
inpclass = this.singleFltCssClass;
}
//drop-down filters
if(col===this.fltTypeSlc || col===this.fltTypeMulti){
if(!Mod.dropdown){
Mod.dropdown = new Dropdown(this);
}
if(!this.gridLayout){
fltrow.appendChild(fltcell);
Mod.dropdown.init(i, this.isExternalFlt, fltcell);
}
// checklist
else if(col===this.fltTypeCheckList){
if(!Mod.checkList){
Mod.checkList = new CheckList(this);
}
inpclass = (i==n-1 && this.displayBtn) ?
this.fltSmallCssClass : this.fltCssClass;
Mod.checkList.init(i, this.isExternalFlt, fltcell);
} else {
this._buildInputFilter(i, inpclass, fltcell);
}
//only 1 input for single search
if(this.singleSearchFlt){
col = this.fltTypeInp;
inpclass = this.singleFltCssClass;
}
// this adds submit button
if(i==n-1 && this.displayBtn){
this._buildSubmitButton(i, fltcell);
}
//drop-down filters
if(col===this.fltTypeSlc || col===this.fltTypeMulti){
if(!Mod.dropdown){
Mod.dropdown = new Dropdown(this);
}
Mod.dropdown.init(i, this.isExternalFlt, fltcell);
}
// checklist
else if(col===this.fltTypeCheckList){
if(!Mod.checkList){
Mod.checkList = new CheckList(this);
}
Mod.checkList.init(i, this.isExternalFlt, fltcell);
} else {
this._buildInputFilter(i, inpclass, fltcell);
}
// this adds submit button
if(i==n-1 && this.displayBtn){
this._buildSubmitButton(i, fltcell);
}
this.emitter.emit('after-filter-init', this, i);
}// for i
} else {
this._resetGrid();
}//if isFirstLoad
this.emitter.emit('after-filter-init', this, i);
}
}//if this.fltGrid
@ -659,12 +606,13 @@ export class TableFilter {
Mod.statusBar = new StatusBar(this);
Mod.statusBar.init();
}
if(this.paging || Mod.paging){
if(this.paging){
if(!Mod.paging){
Mod.paging = new Paging(this);
Mod.paging.init();
} else{
Mod.paging.reset();
}
Mod.paging.reset();
}
if(this.btnReset){
Mod.clearButton = new ClearButton(this);
@ -690,7 +638,6 @@ export class TableFilter {
Mod.noResults.init();
}
this.isFirstLoad = false;
this._hasGrid = true;
if(this.rememberGridValues || this.rememberPageLen ||
@ -723,6 +670,7 @@ export class TableFilter {
this.onFiltersLoaded.call(null, this);
}
this.initialized = true;
this.emitter.emit('initialized', this);
}
@ -992,7 +940,8 @@ export class TableFilter {
return;
}
let rows = this.tbl.rows,
Mod = this.Mod;
Mod = this.Mod,
emitter = this.emitter;
if(this.isExternalFlt && !this.popupFilters){
this.removeExternalFlts();
@ -1000,37 +949,29 @@ export class TableFilter {
if(this.infDiv){
this.removeToolbar();
}
if(this.highlightKeywords){
Mod.highlightKeyword.unhighlightAll();
}
if(this.markActiveColumns){
this.clearActiveColumns();
this.emitter.off(['before-filtering'],
()=> this.clearActiveColumns());
this.emitter.off(['cell-processed'],
emitter.off(['before-filtering'], ()=> this.clearActiveColumns());
emitter.off(['cell-processed'],
(tf, colIndex)=> this.markActiveColumn(colIndex));
}
if(this.hasExtensions){
this.destroyExtensions();
}
for(let j=this.refRow; j<this.nbRows; j++){
// validate row
this.validateRow(j, true);
//removes alternating colors
if(this.alternateRows){
Mod.alternateRows.removeRowBg(j);
}
}//for j
// }//for j
this.validateAllRows();
if(this.fltGrid && !this.gridLayout){
this.fltGridEl = rows[this.filtersRowIndex];
this.tbl.deleteRow(this.filtersRowIndex);
}
// broadcast destroy event
emitter.emit('destroy', this);
// Destroy modules
// TODO: subcribe modules to destroy event instead
Object.keys(Mod).forEach(function(key){
var feature = Mod[key];
if(feature && Types.isFn(feature.destroy)){
@ -1040,18 +981,19 @@ export class TableFilter {
// unsubscribe to events
if(this.hasVisibleRows){
this.emitter.off(['after-filtering'],
()=> this.enforceVisibility());
emitter.off(['after-filtering'], ()=> this.enforceVisibility());
}
if(this.linkedFilters){
this.emitter.off(['after-filtering'], ()=> this.linkFilters());
emitter.off(['after-filtering'], ()=> this.linkFilters());
}
Dom.removeClass(this.tbl, this.prfxTf);
this.nbHiddenRows = 0;
this.validRowsIndex = [];
this.fltIds = [];
this.activeFlt = null;
this._hasGrid = false;
this.initialized = false;
}
/**
@ -1199,120 +1141,26 @@ export class TableFilter {
* Reset persisted filter values
*/
resetValues(){
//only loadFltOnDemand
if(this.rememberGridValues){
if(this.loadFltOnDemand){
this._resetGridValues(this.fltsValuesCookie);
} else {
let fltValues = this.Mod.store.getFilterValues(
this.fltsValuesCookie);
fltValues.forEach((val, idx)=> {
if(val !== ' '){
this.setFilterValue(idx, val);
}
});
}
}
this.filter();
}
/**
* Reset persisted filter values when load filters on demand feature is
* enabled
* @param {String} name cookie name storing filter values
*/
_resetGridValues(name){
if(!this.loadFltOnDemand){
if(!this.rememberGridValues){
return;
}
let fltsValues = this.Mod.store.getFilterValues(name),
slcFltsIndex = this.getFiltersByType(this.fltTypeSlc, true),
multiFltsIndex = this.getFiltersByType(this.fltTypeMulti, true);
//if the number of columns is the same as before page reload
if(Number(fltsValues[(fltsValues.length-1)]) === this.fltIds.length){
for(let i=0; i<(fltsValues.length - 1); i++){
if(fltsValues[i]===' '){
continue;
}
let s, opt;
let fltType = this.getFilterType(i);
// if loadFltOnDemand, drop-down needs to contain stored
// value(s) for filtering
if(fltType===this.fltTypeSlc || fltType===this.fltTypeMulti){
let slc = Dom.id( this.fltIds[i] );
slc.options[0].selected = false;
//selects
if(slcFltsIndex.indexOf(i) != -1){
opt = Dom.createOpt(fltsValues[i], fltsValues[i], true);
slc.appendChild(opt);
this.hasStoredValues = true;
}
//multiple select
if(multiFltsIndex.indexOf(i) != -1){
s = fltsValues[i].split(' '+this.orOperator+' ');
for(let j=0, len=s.length; j<len; j++){
if(s[j]===''){
continue;
}
opt = Dom.createOpt(s[j],s[j],true);
slc.appendChild(opt);
this.hasStoredValues = true;
}
}// if multiFltsIndex
}
else if(fltType === this.fltTypeCheckList){
let checkList = this.Mod.checkList;
let divChk = checkList.checkListDiv[i];
divChk.title = divChk.innerHTML;
divChk.innerHTML = '';
let ul = Dom.create(
'ul',['id',this.fltIds[i]],['colIndex',i]);
ul.className = checkList.checkListCssClass;
let li0 = Dom.createCheckItem(
this.fltIds[i]+'_0', '', this.displayAllText);
li0.className = checkList.checkListItemCssClass;
ul.appendChild(li0);
divChk.appendChild(ul);
s = fltsValues[i].split(' '+this.orOperator+' ');
for(let j=0, len=s.length; j<len; j++){
if(s[j]===''){
continue;
}
let li = Dom.createCheckItem(
this.fltIds[i]+'_'+(j+1), s[j], s[j]);
li.className = checkList.checkListItemCssClass;
ul.appendChild(li);
li.check.checked = true;
checkList.setCheckListValues(li.check);
this.hasStoredValues = true;
}
}
else if(fltType === this.fltTypeInp){
this.setFilterValue(i, fltsValues[i]);
}
}//end for
if(!this.hasStoredValues && this.paging){
this.Mod.paging.setPagingInfo();
let fltValues = this.Mod.store.getFilterValues(this.fltsValuesCookie);
fltValues.forEach((val, idx)=> {
if(val !== ' '){
this.setFilterValue(idx, val);
}
}//end if
});
this.filter();
}
/**
* Filter the table by retrieving the data from each cell in every single
* row and comparing it to the search term for current column. A row is
* hidden when all the search terms are not found in inspected row.
*
* TODO: Reduce complexity of this massive method
*/
filter(){
if(!this.fltGrid || (!this._hasGrid && !this.isFirstLoad)){
if(!this.fltGrid || !this._hasGrid){
return;
}
//invoke onbefore callback
@ -2021,8 +1869,7 @@ export class TableFilter {
* @param {String} searcharg Search term
*/
setFilterValue(index, searcharg=''){
if((!this.fltGrid && !this.isFirstLoad) ||
!this.getFilterElement(index)){
if(!this.fltGrid){
return;
}
let slc = this.getFilterElement(index),
@ -2030,12 +1877,22 @@ export class TableFilter {
if(fltColType !== this.fltTypeMulti &&
fltColType != this.fltTypeCheckList){
if(this.loadFltOnDemand && !this.initialized){
this.emitter.emit('build-select-filter', this, index,
this.linkedFilters, this.isExternalFlt);
}
slc.value = searcharg;
}
//multiple selects
else if(fltColType === this.fltTypeMulti){
let s = searcharg.split(' '+this.orOperator+' ');
// let ct = 0; //keywords counter
if(this.loadFltOnDemand && !this.initialized){
this.emitter.emit('build-select-filter', this, index,
this.linkedFilters, this.isExternalFlt);
}
// TODO: provide a select option helper method in dropdown module
for(let j=0, len=slc.options.length; j<len; j++){
let option = slc.options[j];
if(s==='' || s[0]===''){
@ -2053,16 +1910,26 @@ export class TableFilter {
//checklist
else if(fltColType === this.fltTypeCheckList){
searcharg = Str.matchCase(searcharg, this.caseSensitive);
if(this.loadFltOnDemand && !this.initialized){
this.emitter.emit('build-checklist-filter', this, index,
this.isExternalFlt);
if(!slc){
slc = this.getFilterElement(index);
}
}
let sarg = searcharg.split(' '+this.orOperator+' ');
let lisNb = Dom.tag(slc,'li').length;
let lisNb = Dom.tag(slc, 'li').length;
slc.setAttribute('value', '');
slc.setAttribute('indexes', '');
// TODO: provide a select option helper method in checklist module
for(let k=0; k<lisNb; k++){
let li = Dom.tag(slc,'li')[k],
lbl = Dom.tag(li,'label')[0],
chk = Dom.tag(li,'input')[0],
let li = Dom.tag(slc, 'li')[k],
lbl = Dom.tag(li, 'label')[0],
chk = Dom.tag(li, 'input')[0],
lblTxt = Str.matchCase(
Dom.getText(lbl), this.caseSensitive);
if(lblTxt !== '' && Arr.has(sarg, lblTxt, true)){
@ -2246,73 +2113,6 @@ export class TableFilter {
}// for i
}
/**
* Re-generate the filters grid bar when previously removed
*/
_resetGrid(){
if(this.isFirstLoad){
return;
}
let Mod = this.Mod;
let tbl = this.tbl;
let rows = tbl.rows;
let filtersRowIndex = this.filtersRowIndex;
let filtersRow = rows[filtersRowIndex];
// grid was removed, grid row element is stored in fltGridEl property
if(!this.gridLayout){
// If table has a thead ensure the filters row is appended in the
// thead element
if(tbl.tHead){
var tempRow = tbl.tHead.insertRow(this.filtersRowIndex);
tbl.tHead.replaceChild(this.fltGridEl, tempRow);
} else {
filtersRow.parentNode.insertBefore(this.fltGridEl, filtersRow);
}
Dom.addClass(tbl, this.prfxTf);
}
// filters are appended in external placeholders elements
if(this.isExternalFlt){
let externalFltTgtIds = this.externalFltTgtIds;
for(let ct=0, len=externalFltTgtIds.length; ct<len; ct++){
let extFlt = Dom.id(externalFltTgtIds[ct]);
if(!extFlt){ continue; }
let externalFltEl = this.externalFltEls[ct];
extFlt.appendChild(externalFltEl);
let colFltType = this.getFilterType(ct);
//IE special treatment for gridLayout, appended filters are
//empty
if(this.gridLayout &&
externalFltEl.innerHTML === '' &&
colFltType !== this.fltTypeInp){
if(colFltType === this.fltTypeSlc ||
colFltType === this.fltTypeMulti){
Mod.dropdown.build(ct);
}
if(colFltType === this.fltTypeCheckList){
Mod.checkList.build(ct);
}
}
}
}
this.nbFilterableRows = this.getRowsNb();
this.nbVisibleRows = this.nbFilterableRows;
this.nbRows = rows.length;
if(this.popupFilters){
this.headersRow++;
Mod.popupFilter.reset();
}
this._hasGrid = true;
}
/**
* Determines if passed filter column implements exact query match
* @param {Number} colIndex [description]

78
test/test-disable-filter-onchange.html Normal file
View file

@ -0,0 +1,78 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>TableFilter disable select filter onchange event</title>
<link rel="stylesheet" href="libs/qunit/qunit.css">
<script src="libs/qunit/qunit.js"></script>
<script src="libs/polyfill.js"></script>
</head>
<body>
<table id="demo" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<th>From</th>
<th>Destination</th>
<th>Road Distance (km)</th>
<th>By Air (hrs)</th>
<th>By Rail (hrs)</th>
</tr>
<tr>
<td><strong>Sydney</strong></td>
<td>Adelaide</td>
<td>1412</td>
<td>1.4</td>
<td>25.3</td>
</tr>
<tr>
<td><strong>Sydney</strong></td>
<td>Brisbane</td>
<td>982</td>
<td>1.5</td>
<td>16</td>
</tr>
<tr>
<td><strong>Sydney</strong></td>
<td>Canberra</td>
<td>286</td>
<td>.6</td>
<td>4.3</td>
</tr>
<tr>
<td><strong>Sydney</strong></td>
<td>Melbourne</td>
<td>872</td>
<td>1.1</td>
<td>10.5</td>
</tr>
<tr>
<td><strong>Adelaide</strong></td>
<td>Perth</td>
<td>2781</td>
<td>3.1</td>
<td>38</td>
</tr>
<tr>
<td><strong>Adelaide</strong></td>
<td>Alice Springs</td>
<td>1533</td>
<td>2</td>
<td>20.25</td>
</tr>
<tr>
<td><strong>Adelaide</strong></td>
<td>Brisbane</td>
<td>2045</td>
<td>2.15</td>
<td>40</td>
</tr>
</tbody>
</table>
<script src="../dist/tablefilter/tablefilter.js"></script>
<script src="test-disable-filter-onchange.js"></script>
<div id="qunit"></div>
<div id="qunit-fixture"></div>
</body>
</html>

40
test/test-disable-filter-onchange.js Normal file
View file

@ -0,0 +1,40 @@
(function(win, TableFilter){
var id = function (id){ return document.getElementById(id); };
var tf = new TableFilter('demo', {
base_path: '../dist/tablefilter/',
col_0: 'select',
col_1: 'multiple',
on_change: false
});
tf.init();
module('Sanity checks');
test('Disable onchange event on select filter', function() {
deepEqual(tf instanceof TableFilter, true, 'TableFilter type');
deepEqual(tf.onSlcChange, false, 'Onchange event disabled');
});
module('Behaviour');
test('Cannot filter on selection change', function() {
var flt0 = id(tf.fltIds[0]);
var flt1 = id(tf.fltIds[1]);
var evObj = document.createEvent('HTMLEvents');
evObj.initEvent('change', true, true);
tf.setFilterValue(0, 'Sydney');
flt0.dispatchEvent(evObj);
tf.setFilterValue(1, 'Canberra');
flt1.dispatchEvent(evObj);
deepEqual(tf.getValidRows().length, 0, 'Table not filtered');
deepEqual(tf.nbHiddenRows, 0, 'No hidden rows');
});
module('Tear-down');
test('TableFilter removed', function() {
tf.destroy();
deepEqual(tf.hasGrid(), false, 'Filters removed');
});
})(window, TableFilter);

9
test/test-grid-layout.js
View file

@ -19,7 +19,7 @@ test('GridLayout component', function() {
deepEqual(tf.filtersRowIndex, 1, 'Filters row index');
});
test('Destroy GridLayout component', function() {
test('Destroy TableFilter', function() {
gridLayout.destroy();
deepEqual(gridLayout.tblMainCont, null, 'Main container element removed');
deepEqual(gridLayout.tblCont, null, 'Main HTML table container element removed');
@ -27,3 +27,10 @@ test('Destroy GridLayout component', function() {
deepEqual(gridLayout.headTbl, null, 'Headers HTML table element removed');
notEqual(gridLayout.sourceTblHtml, null, 'Table reference is kept');
});
test('Reset TableFilter', function() {
tf.destroy();
tf.init();
deepEqual(tf instanceof TableFilter, true, 'TableFilter type');
deepEqual(typeof gridLayout, 'object', 'GridLayout instanciated');
});

12
test/test-highlight-keywords.js
View file

@ -26,8 +26,18 @@ test('Highlighted keywords', function() {
0, 'Number of highlighted words');
});
module('Reset feature');
test('can destroy and init TableFilter', function() {
tf.destroy();
tf.init();
deepEqual(typeof highlightKeyword, 'object', 'Instanciated');
deepEqual(highlightKeyword.highlightedNodes instanceof Array,
true, 'Property check');
});
module('Tear-down');
test('can destroy TableFilter DOM elements', function() {
test('can destroy TableFilter DOM elements and clean highlighted words',
function() {
tf.setFilterValue(1, 'Perth');
tf.filter();
tf.destroy();

9
test/test-paging.js
View file

@ -210,6 +210,15 @@ test('Set results per page', function() {
deepEqual(paging.nbPages, 2, 'Expected number of pages');
});
module('Reset feature');
test('can destroy and init TableFilter', function() {
tf.destroy();
tf.init();
notEqual(paging, null, 'Paging instanciated');
deepEqual(paging.pagingLength, 2, 'Paging length');
deepEqual(paging.nbPages, 4, 'Number of pages');
});
module('Tear-down');
test('can destroy TableFilter DOM elements', function() {
tf.destroy();