![]() ![]() |
|||||||
|
|||||||
![]() |
|||||||
|
|||||||
IntroductionWith CodeThatTable you can
For work with CodeThatTable you need the following files: <!-- SDK --> <script language="javascript" src="../Scripts/codethatsdk.js"></script> <!-- types and compare functions --> <script language="javascript" src="../Scripts/codethattype.js"></script> <!-- CodeThatTable Class --> <script language="javascript" src="../Scripts/codethattablestd.js"></script> <!-- data and global variables (you can use any file name) --> <script language="javascript" src="content.js"></script> <!-- style sheet (you can use any file name) --> <link rel="stylesheet" href="style.css"> CodeThatTable Initialization:<script language="javascript1.2"> <!-- // CodeThatTable variable contains link to object of CCodåThatTable class, // it's name should be equal with name passing to constructor var CodeThatTable = new CCodeThatTable("CodeThatTable"); CodeThatTable.loadData(gridDef); // data initialization from gridDef structure CodeThatTable.doAction(); // work with table //--> </script> GridDef structure is used for complete table definition. Detailed information about it is represented at Below is a general structure GridDef (parameters marked (*) are required): var gridDef = { amountPerPage : INT, // (*) rows amount per page useMultiSort : BOOLEAN, // (*) whether we use multisort datatype : INT, // 0 - array (default), 1 - csv string, // 2 - CSV file, 3 - xml file data : ARRAY == [][] || STRING // (*) data for columns with Image type // (*) column definitions array colDef : ARRAY == [ { title : STRING, // (*) column title titleClass : "", // (*) type : STRING, // (*) data type width : INT, // (*) column width alignment : STRING, // (*) column alignment compareFunction : FUNCTION, // (*) compare function isVisible : BOOLEAN, // (*) whether column is visible useAutoIndex : BOOLEAN, // (*) auto sort useAutoFilter : BOOLEAN // (*) auto filter } ], rowHandler : FUNCTION keyCol : INT // (*) css classes for rows visualization rowStyle : { markClass : "", // (*) marked string darkClass : "", // (*) dark string lightClass : "", // (*) light string hoverClass : "" // (*) active string }, // (*) images for table imgSortAsc : { }, imgSortDesc : { }, imgSortAscActive : { }, imgSortDescActive : { }, imgMultiSortAscActive : { }, imgMultiSortDescActive : { }, imgFirstPage : { }, imgLastPage : { }, imgPrevPage : { }, imgNextPage : { } }; Global variables : var DATE_FORMAT = "dd.mm.yyyy"; - date format var EMPTY_ROW = "no filter"; |
|||||||
© CodeThat.com, 2003-2005 |