Documentation

HTML Table Filter Generator is no longer maintained, it is now replaced by the TableFilter project. Don't hesitate to check the demos out in their new location along with exhaustive documentation in the project's WIKI.

Table Filter Class

Public Methods

Method Description Remarks Example
AddGrid() generates the filters grid bar according to configuration properties   myTF.paging = true;
...
myTF.AddGrid();
RemoveGrid() removes the filters grid bar   myTF.RemoveGrid();
RefreshGrid() regenerates the filters grid bar   myTF.RefreshGrid();
AddPaging( filterTable ) adds paging behaviour and paging elements (pages drop-down list, previous, next, first, last buttons) if paging disabled and then filters table if filterTable parameter set true (boolean)   myTF.AddPaging(true);
SetPaging() sets paging elements only (pages drop-down list, previous, next, first, last buttons) use AddPaging() method to add paging feature if filter grid bar previously set with no paging feature myTF.SetPaging();
RemovePaging() removes paging elements only set paging property to false if you want to remove paging feature myTF.paging = false; //removes feature
myTF.RemovePaging();
SetFixedHeaders() sets fixed headers and table body scrolling   myTF.SetFixedHeaders();
RemoveFixedHeaders() removes fixed headers   myTF.RemoveFixedHeaders();
SetRowsCounter() sets rows counter label   myTF.SetRowsCounter();
RemoveRowsCounter() removes rows counter label   myTF.RemoveRowsCounter();
SetResultsPerPage() sets results per pages drop-down list   myTF.SetResultsPerPage();
RemoveResultsPerPage() removes results per pages drop-down list   myTF.RemoveResultsPerPage();
SetResetBtn() sets reset button   myTF.SetResetBtn();
RemoveResetBtn() removes reset button   myTF.RemoveResetBtn();
SetAlternateRows() alternates rows color   myTF.alternateBgs = true;
myTF.SetAlternateRows();
RemoveAlternateRows() removes alternating rows color note that in code example beside alternating rows are cleared and behaviour itself is also removed (myTF.alternateBgs = false;) myTF.alternateBgs = false;
myTF.RemoveAlternateRows();
RemoveExternalFlts() removes external filters if isExternalFlt property set true   myTF.isExternalFlt = true;
myTF.RemoveExternalFlts();
Filter() filters table   myTF.Filter();
SetPopupFilterIcons() new sets the popup filter icons   myTF.SetPopupFilterIcons();
SetPopupFilters() new sets the popup filter containers   myTF.SetPopupFilters();
RemovePopupFilters() new removes the popup filter icons and containers   myTF.RemovePopupFilters();
SetHelpInstructions() new sets the help elements (label and container)   myTF.SetHelpInstructions();
RemoveHelpInstructions() new removes the help elements   myTF.RemoveHelpInstructions();
ClearFilters() clears grid bar filters   myTF.ClearFilters();
ClearActiveColumns() new clears filtered column headers css classes   myTF.ClearActiveColumns();
SetPage( cmd )

shows page according to param value (string or number):

  • string: "next","previous","last","first" or
  • number: page number
   myTF.SetPage('next');
myTF.SetPage(2);
HasGrid() checks if table has a filter grid and returns a boolean   myTF.HasGrid();
PopulateSelect( colIndex, isExternal, extSlcId )

populates an external select with the values of a given column:

  • colIndex: index of the column to use for populating select (number)
  • isExternal: boolean, set true to fill an external select
  • extSlcId: id of external select to populate (string)
   myTF.PopulateSelect(0, true, 'mySelectId');
GetFilterId( index )

returns filter id of a specified column:

  • index: column index (numeric value)
 note that hidden filters are also returned myTF.GetFilterId(1);
GetFiltersId() returns an array containing filters' ids note that hidden filters are also returned myTF.GetFiltersId();
GetFilterValue( index )

retrieves the value of a specified filter:

  • index: filter column index (number)
 note that the first filter's index is 0 myTF.GetFilterValue(5);
GetFiltersByType( type, bool )

returns an array containing filters' ids of a specified type (inputs or selects):

  • type: filter type string ("input", "select", "multiple")
  • optional boolean: if set true method returns column indexes otherwise filters ids
   myTF.GetFiltersByType('select', true);
GetFiltersValue() returns an array containing the value of every single filter of the grid bar   myTF.GetFiltersValues();
GetFilterElement( index )

returns the filter DOM element for a given column index

  • index: filter column index (number)
   var fltElm = myTF.GetFilterElement(2);
GetHeaderElement( index )

returns the column header DOM element for a given column index

  • index: header column index (number)
   var headElm = myTF.GetHeaderElement(1);
SetFilterValue( index, searcharg )

sets value in a specified filter:

  • index: filter column index (number)
  • searcharg: search string
   myTF.SetFilterValue(1,'my search string');
GetColValues( colindex, num, exclude )

returns an array containing the cell values of a specified column:

  • colindex: column index (number)
  • num: a boolean set to true if we want only numbers to be returned (used for column calculations)
  • exclude (optional): array containing rows indexes to be excluded from returned values
   myTF.GetColValues(2, false);
GetValidRowsIndex( reCalc ) returns an array containing valid rows indexes (rows visible upon filtering) Param:
  • reCalc: if set true the valid rows indexes are re-calculated (boolean)
   myTF.GetValidRowsIndex();
GetStartRowIndex() returns the index of the row from which will start the filtering process   myTF.GetStartRowIndex();
GetLastRowIndex() returns the index of the last row   myTF.GetLastRowIndex();
GetFiltersRowIndex() returns the index of the filters' row   myTF.GetFiltersRowIndex();
GetHeadersRowIndex() returns the index of the headers' row   myTF.GetHeadersRowIndex();
GetTableData()

returns an array containing the data of a specified table. The returned array is formated in the following manner:

  • [rowindex,[value1,value2,value3...]]
   myTF.GetTableData();
GetFilteredData( includeHeaders )

returns an array containing only filtered data. The returned array is formated in the following manner:

  • [rowindex,[value1,value2,value3...]]
Param:
  • includeHeaders: if set true header captions are included in returned array (boolean)
   myTF.GetFilteredData();
GetFilteredDataCol( colIndex )

new returns an array containing filtered data of a specified column. The returned array is formated in the following manner:

  • [value1,value2,value3...]
   var a = myTF.GetFilteredDataCol(3);
GetCellsNb( nrow ) returns number of cells of a specified row   myTF.GetCellsNb(1);
GetRowsNb( includeHeaders )

returns total number of filterable rows starting from reference row if defined

Param:
  • includeHeaders: if set true headers row(s) are included in the total (boolean)
   myTF.GetRowsNb();
AddSortType( sType, fGetValueFromString, fCompareFunction, fGetRowValue ) adds a sort type to the sorting feature Note that the table sorting is performed by the WebFX Sortable Table 1.12 script. The AddSortType method calls the SortableTable.prototype.addSortType method accepting the following arguments:
  • sType : String - the identifier of the sort type
  • fGetValueFromString : function ( s : string ) : T - A function that takes a string and casts it to a desired format. If left out the string is just returned
  • fCompareFunction : function ( n1 : T, n2 : T ) : Number - A normal JS sort compare function. Takes two values and compares them. If left out less than, <, compare is used
  • fGetRowValue : function( oRow : HTMLTRElement, nColumn : int ) : T - A function that takes the row and the column index and returns the value used to compare. If left out then the innerText is first taken for the cell and then the fGetValueFromString is used to convert that string the desired value and type
 myTF.AddSortType('customDate', customDateConverter );
GetConfigObject() returns the original configuration object   var config = myTF.GetConfigObject();
GetFilterableRowsNb() returns the total number of rows that can be filtered   var nbFilterableRows = myTF.GetFilterableRowsNb();
E.n.j.o.y. ads-free content!
ezEditTable | © Max Guglielmi
GitHub repo