MatrixTable
A few years back I needed a way to access an HTML table as a matrix (think x,y) so I created this Javascript library for creating and manipulating “MatrixTables”. I have found this little library to be very useful on a number of occasions, so I thought I would share it. Fortunately, it is well documented, and easy to use (at least I think so!).
Inside the ZIP you will find “matrixtable.js”, “matrixtable.css” (include both in any website that will use MatrixTables), and “index.html” (which contains a usage example.)
nadabid.com using MatrixTable to dynamically display the ebay search results
– API Documentation –
/**
* creates a matrixtable instance in the specified div consisting of a NxM matrix
* @param {Object} divId The id of the div where the matrixtable will go
* @return {Object} The MatrixTable object that is created
*/
function createMatrixTable(divId)
/**
* Sets the number of rows in the table
* @param {Integer} sz The number of content rows in the matrixtable
*/
matrixTable.setRowSize(sz)
/**
* Sets the number of columns in the table
* @param {Integer} sz The number of content columns in the matrixtable
*/
matrixTable.setColumnSize(sz)
/**
* Sets headers for the columns
* @param {Array} hd An array of html data that will be set as the content of the headers
*/
matrixTable.setColumnHeaders(hd)
/**
* Sets a header for the specified column
* @param {Integer} c The column for which to set the column header
* @param {String} hd The html data that will be set as the content of the header for the specified column
*/
matrixTable.setColumnHeader(c,hd)
/**
* Sets the content of a cell
* @param {Integer} r The row that the cell is in
* @param {Integer} c The column that the cell is in
* @param {String} cnt The html data that will be set as the content of the specified cell
*/
matrixTable.setCellContent(r,c,cnt)
/**
* Sets the content of a row
* @param {Integer} r The row whose content will be set
* @param {Array} cnt An array of html data that will be set as the content of the cells in the specified row
*/
matrixTable.setRowContent(r,cnt)
/**
* Sets the content of a column
* @param {Integer} c The column whose content will be set
* @param {Array} cnt An array of html data that will be set as the content of the cells in the specified column
*/
matrixTable.setColumnContent(c,cnt)
/**
* Sets the style of the Table
* @param {Object} stl The object containing an associative array of styles to be set on the Table
*/
matrixTable.setTableStyle(stl)
/**
* Sets the style of the Row
* @param {Integer} r The row whose style will be set
* @param {Object} stl The object containing an associative array of styles to be set on the cells in the specified row
*/
matrixTable.setRowStyle(r, stl)
/**
* Sets the style of the Column
* @param {Integer} c The column whose style will be set
* @param {Object} stl The object containing an associative array of styles to be set on the cells in the specified column
*/
matrixTable.setColumnStyle(c, stl)
/**
* Sets the style of the Cell
* @param {Integer} r The row that the cell is in
* @param {Integer} c The column that the cell is in
* @param {Object} stl The object containing an associative array of styles to be set on the specified cell
*/
matrixTable.setCellStyle(r,c,stl)
/**
* Shows the column headers if set to true (default is false)
* @param {Boolean} sw The boolean value to set on the showColumnHeaders flag
*/
matrixTable.showColumnHeaders(sw)
/**
* Shows the row if set to true, and hides it otherwise (default is true)
* @param {Integer} r The row that will be made visible or hidden
* @param {Boolean} sw The boolean value to set on the showRow flag
*/
matrixTable.showRow(r,sw)
/**
* Shows the column if set to true, and hides it otherwise (default is true)
* @param {Integer} c The column that will be made visible or hidden
* @param {Boolean} sw The boolean value to set on the showColumn flag
*/
matrixTable.showColumn(c,sw)
/**
* Destroy the this matrixtable
*/
matrixTable.destroy()