|
Here we provide documentation for the free version only.
You can view full documentation for advanced version of TreeTable applet
. You also will find
there a list of all features of TreeTable.
New: we have developed VB class to provide simple interface
to our applet from ASP pages - you just set table name and key column,
and our class will do all other routine work for you!
You can download samples and docs for our class .
Below you can see a typical applet initialization code:
<applet width="600" height="300" codebase="../bin" archive="treetable.jar"
code="JTreeGridApplet.class" name="MyGrid" MAYSCRIPT>
<param name="ICON0" value="icons/item_root1.gif">
<param name="ICON1" value="icons/item_open1.gif">
<param name="ICON2" value="icons/item_closed.gif">
<param name="ICON3" value="icons/item_node.gif">
<param name="SORT_UP" value="icons/up.gif">
<param name="SORT_DOWN" value="icons/down.gif">
<param name="EXPANDROOT" value="1">
<param name="INITWIDTHS" value="45$$15$$20$$20">
<param name="HEADER" value="Book Name$$Price$$Cover$$Ships in">
<PARAM NAME=ITEM0 VALUE="97">
<PARAM NAME=TEXT0 VALUE="Book Shop">
<PARAM NAME=ACTION0 VALUE="97">
<PARAM NAME=LEVEL0 VALUE="0">
<PARAM NAME=ITEM1 VALUE="98">
<PARAM NAME=TEXT1 VALUE="The Testament$$5.35$$Paperback$$24 hours">
<PARAM NAME=ACTION1 VALUE="98">
<PARAM NAME=LEVEL1 VALUE="1">
</applet>
As you can see, all applet parameters are divided into two groups - global
parameters defining the whole applet behavior (like column headers, icon
list to use in the tree, JavaScript function name to call on row selection
etc.), and parameters describing each row.
1. Global parameters
| HEADER |
Text labels of column headers separated by $$
<param name="HEADER" value="Book Name$$Price$$Cover$$Ships in">
|
| INITWIDTHS |
Initial column widths in percent separated by $$.
Later you can resize them with mouse.
<param name="INITWIDTHS" value="45$$15$$20$$20"> |
| EVAL |
The name of script function, which will be called when
any item in grid is selected. Item's action will be passed as
parameter list to this function.
Example:
function f(s1, s2){}
<PARAM name="EVAL" VALUE="f">
<PARAM name="ACTION0" VALUE="0,0">
// f(0,0) will be called
<PARAM name="ACTION0" VALUE="'test',28">
// f('test',28) will
be called
<PARAM name="ACTION0" VALUE="28">
// Invalid, function does't take
one argument |
| EXPANDROOT |
If specified, root nodes will be initially expanded.
<param name="EXPANDROOT" value="1"> |
SORT_UP,
SORT_DOWN |
Specify the images to display in
header cells to show sort direction.
<param name="SORT_UP" value="icons/up.gif">
<param name="SORT_DOWN" value="icons/down.gif"> |
| ICONi |
Defines the image list, i - sequential integer, begins
from 0. Later you can use this index as a value for row parameters
IM0, IM1. Root directory for images is applet's archive directory.
<param name="ICON0" value="icons/item_root1.gif">
<param name="ICON1" value="icons/item_open1.gif">
<param name="ICON2" value="icons/item_closed.gif"> |
| COLOR1 |
Color of the selected row
<param name="COLOR1"
value="#55cc77"> |
2. Row parameters
This parameters specify content and behavior of each table row. Index i
is sequential integer, begins from 0.
| ITEMi |
Identifier of the row. Used in all script functions to
locate the row.
<PARAM NAME=ITEM0 VALUE="97">
|
| TEXTi |
The
values of all cells in the row separated with $$
<PARAM NAME=TEXT3
VALUE="cell1$$cell2$$next cell$$the last cell"> |
| ACTIONi |
Item's action, will be passed as
parameter list to the JavaScript function specified in EVAL
parameter.
<PARAM NAME=ACTION1 VALUE="98">
|
| LEVELi |
Level of current row. Defines
tree structure of the table. Must be
from 0 to LEVEL(i-1) + 1
<PARAM NAME=LEVEL0 VALUE="0">
|
| IM0i, IM1i |
Index of icon for the row in icon list (see ICON
parameters) for Opened and Closed states respectively. Is optional.
Default values for root node is 0, for leave node is 3, for all
other nodes IM0=1, IM1=2.
<PARAM NAME=IM03
VALUE="2">
|
| TEXTCOLORi |
Color of the cell's text.
<param name="TEXTCOLOR1"
value="#55cc77"> |
| BGCOLORi |
Color of the cell's background.
<param name="BGCOLOR3"
value="#55cc77"> |
| BOLDi |
If specified, row text will be bold.
<param name="BOLD12"
value="1"> |
| SELECTi |
If specified, row will be selected.
<param name="SELECT7"
value="1"> |
3. Applet API
You can call methods of TreeTable applet in JavaScript functions.
TreeTable is inherited from Table, so you can use all of the methods
below, except 1,11,12 which have no sense with tree structure.
Example of code:
<script
language="JavaScript">
function getSomeValue(col)
{
var a = document.applets.MyGrid;
var id = a.getSelectedId();
if(id==null) return null;
var value = a.getCellValue(id, col);
return value;
}
</script>
Table (JGrid applet)
1.public void addRow(String new_id, String text, String action).
adds a new row to the table
2.public void deleteRow(String id)
deletes the row with the specified id
3.public String getSelectedId()
returns the id of the selected row
4.public void deleteSelectedItem()
deletes the selected row
5.public String getAction(String id)
returns the action of the specified row
6.public void setRowTextBold(String id)
sets the bold text for the specified row (against normal)
7.public void setRowTextNormal(String id)
sets the normal text for the specified row (against bold)
8.public boolean isItemExists(String id)
returns true if the row with specified id exists in the table,
otherwise false
9.public String getAllItemIds(String separator)
returns a list of all rows ids separated by specified separator
10.public int getRowsNum()
returns the total number of rows in the table
11.public void moveRowUp(String id)
moves the specified row up in the table
12.public void moveRowDown(String id)
moves the specified row down in the table
13.public String getCellValue(String id, int col)
returns the specified cell value (id means the row id, col is the
column index)
TreeTable (JTreeGrid applet)
1. public void insertNewChild(String parent_id, String new_id, String
text, String action, [int icon0,int icon1])
inserts a new row as a child row for the specified parent row
(parent_id)
2.public void insertNewNext(String parent_id, String new_id, String
text, String action, [int icon0,int icon1])
inserts a new row at the same level as the specified row (parent_id)
3.public void insertRoot(String new_id, String text, String action,
[int icon0,int icon1])
inserts a new row at the root level
4.public boolean isRowBold(String id)
returns boolean value indicating if the specified row is bold or not
5.public String getAllItemIds(String separator)
returns a list of all rows ids separated by specified separator
6.public void setRowIcons(String id, int icon1, int icon2)
sets the icons for the specified row, for Opened and Closed state respectively
7.public void setCellValue(String id, int col, String value)
sets the specified cell value (id means the row id, col is the column index)
Note: you can use methods of Table also
for TreeTable, except 1,11,12 which have no sense with tree structure.
| 
