Unlimited number of tables on single page

You can put several tables at the same page. You should specify gridDef object for each table. Then you can create table objects:

... html code ...

<script language="javascript1.2">
<!--
var ctg = new CCodeThatTable("ctg");
ctg.loadData(gridDef);
ctg.doAction(); 
//-->
</script>

 ... html code ...

<script language="javascript1.2">
<!--
var ctg1 = new CCodeThatTable("ctg1");
ctg1.loadData(gridDef1);
ctg1.doAction(); 
//-->
</script>

 ... html code ...

<script language="javascript1.2">
<!--
var ctgN = new CCodeThatTable("ctgN");
ctgN.loadData(gridDefN);
ctgN.doAction(); 
//-->
</script>

Table Keys

If you need to create linked tables you should specify

function rowHandler(keyArray)
{
	childtable.setKeyArray(childtable.keyCol, keyArray.concat([ - 1]));
};
...
keyCol : "ID", // number in array ColDef or title of key column
rowHandler : rowHandler, 

for a table, which requires click event handle.

For a child table you specify only

keyCol : "ID"

Example code:

function rowHandler(keyArray) {
	CodeThatGrid1.setKeyArray(CodeThatGrid1.keyCol, keyArray.concat([ - 1]));
};
// main table
var gridDef = {
	...
	keyCol : "ID",
	rowHandler : rowHandler,
	...
};
// child table
var gridDef1 = {
	...
	keyCol : "ID",
	...
}; 

rowHandler function is called after click at the main table and initiates any actions you'd like to perform depending on selected rows. Function parameter is array of key values according to selected table rows (you can select several rows by using Ctrl or/and Shift buttons).

At gridDef you set just a function name (link at the function, because of this you don't have to specify function parameters here).

keyCol is an optional parameter. By default we set the first table column as keyCol.

But it's strongly recommended to set it by yourself, because it's an index value.

Important - don't forget to spesify a link between main and child tables

maintable.keycol->childtable.keycol

- set rowHandler and keyCol fields for main table and keyCol field for a child one.

Key Column and Key Array

You can use the following functions:

array getKeyArray(keyCol) - forms key array

void setKeyArray(keyCol, keyArray) - is used for linked tables, performs foreign key function.

keyCol can be both column number or column title.

You can cancel setKeyArray by using empty array.

Example - Linked tables

You can see an example and complete code here - Linked tables [popup]

Read more about CodeThatTable >>