1
0
Fork 0
mirror of https://github.com/koalyptus/TableFilter.git synced 2024-06-16 12:45:49 +02:00

Constructor formatting

This commit is contained in:
Max Guglielmi 2014-09-20 18:09:23 +10:00
parent d4bf457cba
commit 620b22d228
2 changed files with 888 additions and 822 deletions

76
src/index.html Normal file
View file

@ -0,0 +1,76 @@
<!DOCTYPE html>
<html lang="en">
<head>
<link href="filtergrid.css">
</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 width="15%">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 type="text/javascript" src="tablefilter_all.js"></script>
<script>
var tf = setFilterGrid("demo", {
base_path: '',
enable_default_theme: true
});
</script>
</body>
</html>

View file

@ -3,7 +3,7 @@
- By Max Guglielmi (tablefilter.free.fr) - By Max Guglielmi (tablefilter.free.fr)
- Licensed under the MIT License - Licensed under the MIT License
-------------------------------------------------------------------------- --------------------------------------------------------------------------
Copyright (c) 2009-2012 Max Guglielmi Copyright (c) 2009-2014 Max Guglielmi
Permission is hereby granted, free of charge, to any person obtaining Permission is hereby granted, free of charge, to any person obtaining
a copy of this software and associated documentation files (the a copy of this software and associated documentation files (the
@ -54,15 +54,17 @@ var TF = (function() {
this.hasGrid = false; this.hasGrid = false;
this.enableModules = false; this.enableModules = false;
if(this.tbl !== null && this.tbl.nodeName.tf_LCase() === 'table' && if(!this.tbl || this.tbl.nodeName.tf_LCase() !== 'table' ||
this.GetRowsNb() > 0){ this.GetRowsNb() === 0){
throw new Error(
'Could not instantiate TF object: table not found.');
}
if(arguments.length>1){ if(arguments.length>1){
for(var i=0; i<arguments.length; i++) for(var i=0; i<arguments.length; i++){
{
var arg = arguments[i]; var arg = arguments[i];
var argtype = typeof arg; var argtype = typeof arg;
switch(argtype.tf_LCase()) switch(argtype.tf_LCase()){
{
case 'number': case 'number':
this.startRow = arg; this.startRow = arg;
break; break;
@ -143,18 +145,30 @@ var TF = (function() {
this.fltCellTag = f.filters_cell_tag!=='th' || this.fltCellTag = f.filters_cell_tag!=='th' ||
f.filters_cell_tag!=='td' ? 'td' : f.filters_cell_tag; f.filters_cell_tag!=='td' ? 'td' : f.filters_cell_tag;
this.fltIds = []; //stores filters ids //stores filters ids
this.fltElms = []; //stores filters DOM elements this.fltIds = [];
this.searchArgs = null; //stores filters values //stores filters DOM elements
this.tblData = []; //stores table data this.fltElms = [];
this.validRowsIndex = null; //stores valid rows indexes (rows visible upon filtering) //stores filters values
this.fltGridEl = null; //stores filters row element this.searchArgs = null;
this.isFirstLoad = true; //is first load boolean //stores table data
this.infDiv = null; //container div for paging elements, reset btn etc. this.tblData = [];
this.lDiv = null; //div for rows counter //stores valid rows indexes (rows visible upon filtering)
this.rDiv = null; //div for reset button and results per page select this.validRowsIndex = null;
this.mDiv = null; //div for paging elements //stores filters row element
this.contDiv = null; //table container div for fixed headers (IE only) 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
this.lDiv = null;
//div for reset button and results per page select
this.rDiv = null;
//div for paging elements
this.mDiv = null;
//table container div for fixed headers (IE only)
this.contDiv = null;
//defines css class for div containing paging elements, rows counter etc. //defines css class for div containing paging elements, rows counter etc.
this.infDivCssClass = f.inf_div_css_class || 'inf'; this.infDivCssClass = f.inf_div_css_class || 'inf';
@ -220,9 +234,10 @@ var TF = (function() {
//wheter excluded options are disabled //wheter excluded options are disabled
this.disableExcludedOptions = f.disable_excluded_options===true ? this.disableExcludedOptions = f.disable_excluded_options===true ?
true : false; true : false;
//stores active filter element
this.activeFlt = null; //stores active filter element this.activeFlt = null;
this.activeFilterId = null; //id of active filter //id of active filter
this.activeFilterId = null;
//enables/disbles column operation(sum,mean) //enables/disbles column operation(sum,mean)
this.hasColOperation = f.col_operation===true ? true : false; this.hasColOperation = f.col_operation===true ? true : false;
this.colOperation = null; this.colOperation = null;
@ -239,8 +254,7 @@ var TF = (function() {
//stores filters elements if isExternalFlt is true //stores filters elements if isExternalFlt is true
this.externalFltEls = []; this.externalFltEls = [];
//delays any filtering process if loader true //delays any filtering process if loader true
this.execDelay = !isNaN(f.exec_delay) ? this.execDelay = !isNaN(f.exec_delay) ? parseInt(f.exec_delay,10) : 100;
parseInt(f.exec_delay, 10) : 100;
//enables/disables status messages //enables/disables status messages
this.status = f.status===true ? true : false; this.status = f.status===true ? true : false;
//calls function when filters grid loaded //calls function when filters grid loaded
@ -270,8 +284,7 @@ var TF = (function() {
//popup filters //popup filters
this.popUpFilters = f.popup_filters===true ? true : false; this.popUpFilters = f.popup_filters===true ? true : false;
//active columns color //active columns color
this.markActiveColumns = f.mark_active_columns===true ? this.markActiveColumns = f.mark_active_columns===true ? true : false;
true : false;
//defines css class for active column header //defines css class for active column header
this.activeColumnsCssClass = f.active_columns_css_class || this.activeColumnsCssClass = f.active_columns_css_class ||
'activeHeader'; 'activeHeader';
@ -288,8 +301,7 @@ var TF = (function() {
this.enableSlcResetFilter = f.enable_slc_reset_filter===false ? this.enableSlcResetFilter = f.enable_slc_reset_filter===false ?
false : true; false : true;
//enables/disables empty option in combo-box filters //enables/disables empty option in combo-box filters
this.enableEmptyOption = f.enable_empty_option===true ? this.enableEmptyOption = f.enable_empty_option===true ? true : false;
true : false;
//defines empty option text //defines empty option text
this.emptyText = f.empty_text || '(Empty)'; this.emptyText = f.empty_text || '(Empty)';
//enables/disables non empty option in combo-box filters //enables/disables non empty option in combo-box filters
@ -339,8 +351,8 @@ var TF = (function() {
this.checkListItemCssClass = f.checklist_item_css_class || this.checkListItemCssClass = f.checklist_item_css_class ||
'flt_checklist_item'; 'flt_checklist_item';
//defines css class for selected checklist item (li) //defines css class for selected checklist item (li)
this.checkListSlcItemCssClass = this.checkListSlcItemCssClass = f.checklist_selected_item_css_class ||
f.checklist_selected_item_css_class || 'flt_checklist_slc_item'; 'flt_checklist_slc_item';
//Load on demand text //Load on demand text
this.activateCheckListTxt = f.activate_checklist_text || this.activateCheckListTxt = f.activate_checklist_text ||
'Click to load filter data'; 'Click to load filter data';
@ -397,8 +409,7 @@ var TF = (function() {
this.onBeforeReset = tf_IsFn(f.on_before_reset) ? this.onBeforeReset = tf_IsFn(f.on_before_reset) ?
f.on_before_reset : null; f.on_before_reset : null;
//callback function after filters are cleared //callback function after filters are cleared
this.onAfterReset = tf_IsFn(f.on_after_reset) ? this.onAfterReset = tf_IsFn(f.on_after_reset) ? f.on_after_reset : null;
f.on_after_reset : null;
/*** paging ***/ /*** paging ***/
//enables/disables table paging //enables/disables table paging
@ -463,8 +474,7 @@ var TF = (function() {
this.ezEditTableConfig.name = this.ezEditTableConfig.name =
this.ezEditTableConfig['name']!==undefined ? this.ezEditTableConfig['name']!==undefined ?
f.ezEditTable_config.name : 'ezedittable'; f.ezEditTable_config.name : 'ezedittable';
this.ezEditTableConfig.src = this.ezEditTableConfig.src = this.ezEditTableConfig['src']!==undefined ?
this.ezEditTableConfig['src']!==undefined ?
f.ezEditTable_config.src : f.ezEditTable_config.src :
this.basePath+'ezEditTable/ezEditTable.js'; this.basePath+'ezEditTable/ezEditTable.js';
//ezEditTable stylesheet not imported by default as filtergrid.css //ezEditTable stylesheet not imported by default as filtergrid.css
@ -526,8 +536,7 @@ var TF = (function() {
this.msgPopulateCheckList = f.msg_populate_checklist || this.msgPopulateCheckList = f.msg_populate_checklist ||
'Populating list...'; 'Populating list...';
//changing paging page //changing paging page
this.msgChangePage = f.msg_change_page || this.msgChangePage = f.msg_change_page || 'Collecting paging data...';
'Collecting paging data...';
//clearing filters //clearing filters
this.msgClear = f.msg_clear || 'Clearing filters...'; this.msgClear = f.msg_clear || 'Clearing filters...';
//changing nb results/page //changing nb results/page
@ -697,12 +706,10 @@ var TF = (function() {
loadextensions: 'LoadExtensions', loadextensions: 'LoadExtensions',
loadthemes: 'LoadThemes' loadthemes: 'LoadThemes'
}, },
_DetectKey: function(e)
/*==================================================== /*====================================================
- common fn that detects return key for a given - Detects <enter> key for a given element
element (onkeypress for inputs)
=====================================================*/ =====================================================*/
{ _DetectKey: function(e) {
if(!o.enterKey) return; if(!o.enterKey) return;
var evt = e || window.event; var evt = e || window.event;
if(evt) if(evt)
@ -721,22 +728,18 @@ var TF = (function() {
} }
}//if evt }//if evt
}, },
_OnKeyUp: function(e)
/*==================================================== /*====================================================
- onkeyup event for text filters - onkeyup event for text filters
(onKeyUp property)
=====================================================*/ =====================================================*/
{ _OnKeyUp: function(e) {
if(!o.onKeyUp) return; if(!o.onKeyUp) return;
var evt = e || window.event; var evt = e || window.event;
var key=(evt.charCode)?evt.charCode: var key=(evt.charCode)?evt.charCode:
((evt.keyCode)?evt.keyCode:((evt.which)?evt.which:0)); ((evt.keyCode)?evt.keyCode:((evt.which)?evt.which:0));
o.isUserTyping = false; o.isUserTyping = false;
if(key!=13 && key!=9 && key!=27 && key!=38 && key!=40) if(key!=13 && key!=9 && key!=27 && key!=38 && key!=40) {
{ function filter() {
function filter()
{
window.clearInterval(o.onKeyUpTimer); window.clearInterval(o.onKeyUpTimer);
o.onKeyUpTimer = undefined; o.onKeyUpTimer = undefined;
if(!o.isUserTyping) if(!o.isUserTyping)
@ -745,35 +748,33 @@ var TF = (function() {
o.isUserTyping = null; o.isUserTyping = null;
} }
} }
if(o.onKeyUpTimer==undefined) if(o.onKeyUpTimer===undefined)
o.onKeyUpTimer = window.setInterval(filter, o.onKeyUpDelay); o.onKeyUpTimer = window.setInterval(filter, o.onKeyUpDelay);
} else { } else {
window.clearInterval(o.onKeyUpTimer); window.clearInterval(o.onKeyUpTimer);
o.onKeyUpTimer = undefined; o.onKeyUpTimer = undefined;
} }
}, },
_OnKeyDown: function(e)
/*==================================================== /*====================================================
- onkeydown event for input filters - onkeydown event for input filters
(onKeyUp property)
=====================================================*/ =====================================================*/
{ _OnKeyDown: function(e) {
if(!o.onKeyUp) return; if(!o.onKeyUp) { return; }
o.isUserTyping = true; o.isUserTyping = true;
}, },
_OnInpBlur: function(e)
/*==================================================== /*====================================================
- onblur event for input filters (onKeyUp property) - onblur event for input filters
=====================================================*/ =====================================================*/
{ _OnInpBlur: function(e) {
if(o.onKeyUp){ if(o.onKeyUp){
o.isUserTyping = false; o.isUserTyping = false;
window.clearInterval(o.onKeyUpTimer); window.clearInterval(o.onKeyUpTimer);
} }
//Watermark //Watermark
if(this.value == '' && o.inpWatermark != ''){ if(this.value === '' && o.inpWatermark !== ''){
this.value = (o.isInpWatermarkArray) this.value = (o.isInpWatermarkArray) ?
? o.inpWatermark[this.getAttribute('ct')] : o.inpWatermark; o.inpWatermark[this.getAttribute('ct')] :
o.inpWatermark;
tf_AddClass(this, o.inpWatermarkCssClass); tf_AddClass(this, o.inpWatermarkCssClass);
} }
if(o.ezEditTable){ if(o.ezEditTable){
@ -781,23 +782,23 @@ var TF = (function() {
if(o.selectable) o.ezEditTable.Selection.Set(); if(o.selectable) o.ezEditTable.Selection.Set();
} }
}, },
_OnInpFocus: function(e)
/*==================================================== /*====================================================
- onfocus event for input filters - onfocus event for input filters
=====================================================*/ =====================================================*/
{ _OnInpFocus: function(e) {
var evt = e || window.event; var evt = e || window.event;
o.activeFilterId = this.getAttribute('id'); o.activeFilterId = this.getAttribute('id');
o.activeFlt = tf_Id(o.activeFilterId); o.activeFlt = tf_Id(o.activeFilterId);
//Watermark //Watermark
if(!o.isInpWatermarkArray){ if(!o.isInpWatermarkArray){
if(this.value == o.inpWatermark && o.inpWatermark != ''){ if(this.value === o.inpWatermark &&
o.inpWatermark !== ''){
this.value = ''; this.value = '';
tf_RemoveClass(this, o.inpWatermarkCssClass); tf_RemoveClass(this, o.inpWatermarkCssClass);
} }
} else { } else {
var inpWatermark = o.inpWatermark[this.getAttribute('ct')]; var inpWatermark = o.inpWatermark[this.getAttribute('ct')];
if(this.value == inpWatermark && inpWatermark != ''){ if(this.value === inpWatermark && inpWatermark !== ''){
this.value = ''; this.value = '';
tf_RemoveClass(this, o.inpWatermarkCssClass); tf_RemoveClass(this, o.inpWatermarkCssClass);
} }
@ -811,58 +812,54 @@ var TF = (function() {
if(o.selectable) o.ezEditTable.Selection.Remove(); if(o.selectable) o.ezEditTable.Selection.Remove();
} }
}, },
_OnSlcFocus: function(e)
/*==================================================== /*====================================================
- onfocus event for select filters - onfocus event for select filters
=====================================================*/ =====================================================*/
{ _OnSlcFocus: function(e) {
var evt = e || window.event; var evt = e || window.event;
o.activeFilterId = this.getAttribute('id'); o.activeFilterId = this.getAttribute('id');
o.activeFlt = tf_Id(o.activeFilterId); o.activeFlt = tf_Id(o.activeFilterId);
if(o.fillSlcOnDemand && this.getAttribute('filled') == '0') if(o.fillSlcOnDemand && this.getAttribute('filled') === '0')
{// select is populated when element has focus {// select is populated when element has focus
var ct = this.getAttribute('ct'); var ct = this.getAttribute('ct');
o.PopulateSelect(ct); o.PopulateSelect(ct);
if(!tf_isIE) this.setAttribute('filled','1'); if(!tf_isIE){ this.setAttribute('filled','1'); }
} }
if(o.popUpFilters){ if(o.popUpFilters){
tf_CancelEvent(evt); tf_CancelEvent(evt);
tf_StopEvent(evt); tf_StopEvent(evt);
} }
}, },
_OnSlcChange: function(e)
/*==================================================== /*====================================================
- onchange event for select filters - onchange event for select filters
=====================================================*/ =====================================================*/
{ _OnSlcChange: function(e) {
var colIndex = o.activeFlt.getAttribute('colIndex');
//Checks filter is a checklist and caller is not null //Checks filter is a checklist and caller is not null
if(o.activeFlt && o.activeFlt.getAttribute('colIndex') && if(o.activeFlt && colIndex &&
o['col'+o.activeFlt.getAttribute('colIndex')]==o.fltTypeCheckList && o['col'+colIndex]===o.fltTypeCheckList &&
!o.Evt._OnSlcChange.caller) return; !o.Evt._OnSlcChange.caller){ return; }
var evt = e || window.event; var evt = e || window.event;
if(o.popUpFilters) tf_StopEvent(evt); if(o.popUpFilters){ tf_StopEvent(evt); }
if(o.onSlcChange) o.Filter(); if(o.onSlcChange){ o.Filter(); }
}, },
_OnSlcBlur: function(e)
/*==================================================== /*====================================================
- onblur event for select filters - onblur event for select filters
=====================================================*/ =====================================================*/
{}, _OnSlcBlur: function(e) {},
_OnCheckListChange: function(e)
/*==================================================== /*====================================================
- onchange event for checklist filters - onchange event for checklist filters
=====================================================*/ =====================================================*/
{ _OnCheckListChange: function(e) {
//Checks caller is not null //Checks caller is not null
if(!o.Evt._OnCheckListChange.caller) return; if(!o.Evt._OnCheckListChange.caller){ return; }
o.Evt._OnSlcChange(e); o.Evt._OnSlcChange(e);
}, },
_OnCheckListClick: function()
/*==================================================== /*====================================================
- onclick event for checklist filters - onclick event for checklist filters
=====================================================*/ =====================================================*/
{ _OnCheckListClick: function() {
if(o.fillSlcOnDemand && this.getAttribute('filled') == '0') if(o.fillSlcOnDemand && this.getAttribute('filled') === '0')
{ {
var ct = this.getAttribute('ct'); var ct = this.getAttribute('ct');
o.PopulateCheckList(ct); o.PopulateCheckList(ct);
@ -870,46 +867,41 @@ var TF = (function() {
o.checkListDiv[ct].title = ''; o.checkListDiv[ct].title = '';
} }
}, },
_OnCheckListFocus: function(e)
/*==================================================== /*====================================================
- onclick event for checklist filter container - onclick event for checklist filter container
=====================================================*/ =====================================================*/
{ _OnCheckListFocus: function(e) {
o.activeFilterId = this.firstChild.getAttribute('id'); o.activeFilterId = this.firstChild.getAttribute('id');
o.activeFlt = tf_Id(o.activeFilterId); o.activeFlt = tf_Id(o.activeFilterId);
}, },
_OnCheckListBlur: function(e){}, _OnCheckListBlur: function(e){},
_OnBtnClick: function()
/*==================================================== /*====================================================
- onclick event for validation button - onclick event for validation button
(btn property) (btn property)
=====================================================*/ =====================================================*/
{ _OnBtnClick: function() {
o.Filter(); o.Filter();
}, },
_OnSlcPagesChangeEvt: null, //used by sort adapter _OnSlcPagesChangeEvt: null, //used by sort adapter
_EnableSlc: function()
/*==================================================== /*====================================================
- onclick event slc parent node (enables filters) - onclick event slc parent node (enables filters)
IE only IE only
=====================================================*/ =====================================================*/
{ _EnableSlc: function() {
this.firstChild.disabled = false; this.firstChild.disabled = false;
this.firstChild.focus(); this.firstChild.focus();
this.onclick = null; this.onclick = null;
}, },
_Clear: function()
/*==================================================== /*====================================================
- clears filters - clears filters
=====================================================*/ =====================================================*/
{ _Clear: function() {
o.ClearFilters(); o.ClearFilters();
}, },
_OnHelpBtnClick: function()
/*==================================================== /*====================================================
- Help button onclick event - Help button onclick event
=====================================================*/ =====================================================*/
{ _OnHelpBtnClick: function() {
o._ToggleHelp(); o._ToggleHelp();
}, },
_Paging: { //used by sort adapter _Paging: { //used by sort adapter
@ -919,8 +911,6 @@ var TF = (function() {
firstEvt: null firstEvt: null
} }
}; };
}//if tbl!=null
} }
TF.prototype = { TF.prototype = {
@ -5582,7 +5572,7 @@ function tf_IsArray(obj){
- checks if passed param is an array - checks if passed param is an array
- returns a boolean - returns a boolean
=====================================================*/ =====================================================*/
return obj.constructor == Array; return (obj && obj.constructor == Array);
} }
function tf_Id(id) function tf_Id(id)