JavaScripTools Manual


Table properties

JavaScripTable has many properties that allow you to customize the table according to your needs.

The categories are:

Look and Feel

There are many look and feel options, so, there is a separate chapter for it.

The table working modes: client and server

The table may be used on both client side or server side modes. This is set using the operationMode property, that can be set to JST_CLIENT_SIDE or JST_SERVER_SIDE. The default value is determined by the JST_DEFAULT_OPERATION_MODE constant.

On client side mode, the table assumes that all rows it contains are all existing rows, so it can handle paging and sorting automatically.

The server side mode requires additional information. The table assumes that the rows it contains belong to the current page, and other rows exists. The rowCount property must be set to the number of total rows. Also, the updateTableFunction must be set to a function reference, and will be called whenever the table must load another page, or change sorting. The function will receive the table reference as argument, and can read from there properties like currentPage, pageSize, sortColumn and ascSort.

There is a specific sample for working with server-side tables here. Here are some examples:

//We need a function to process the table update
function updateTable(table) {
    //Reload with the new page number
    self.location = "mypage?page=" + table.currentPage;
var table = new JavaScripTable(...);
table.operationMode = JST_SERVER_SIDE;
table.updateFunction = updateTable;
table.rowCount = 100; //The server script must know how many rows exists
table.addColumn(...); //Add all columns
table.addRow(...); //Add all rows

If you do not want allow the user to change sorting (it would have to be handled at server side), you can set each column sortable property to false.

Row display

The row count may be limited using the maxRows property. -1 means no limit, and the default value is determined by the JST_DEFAULT_MAX_ROWS constant.

Rows may be displayed by pages or not (showing all rows). This is set by the usePaging property to a boolean value (defaults to JST_DEFAULT_USE_PAGING). If set to true, the results are paged. When paging is used, the pageSize (defaults to JST_DEFAULT_PAGE_SIZE) is used to determine how many rows are displayed per page. The currentPage property reflects the page the user is viewing. The getMaxPage() method may be used to return the page count. Paging may be changed by the user on the navigation bar

Row selection

JavaScripTable offers full control over row selection, offering 3 selection styles:
Selection type Constant Control type
No selection JST_SEL_NONE None
Single row JST_SEL_SINGLE Radio Button
Miltiple row JST_SEL_MULTIPLE or JST_SEL_MULTI Checkbox
The selection type is defined using the selectionType property, that has the default value by the JST_DEFAULT_SELECTION_TYPE constant.

It is possible to determine the control name, so, if the table is inside a form, and the form is submitted, it is possible to retrieve the selected rows on the request. this is done with the selectionName property (JST_DEFAULT_SELECTION_NAME is the default value constant). If selectionName is null, a name will be generated. The value for each radio or checkbox is the row identifier.

One last possible customization on selection is the property selectionValign, that determine the vertical align for selection cells, and have the default value determined by JST_DEFAULT_SELECTION_VALIGN.

The table can have no selection, single row selection (using radioboxes) or multiple row selection (using checkboxes). This is done by the selectionType property, that can be one of these constants: JST_SEL_NONE, JST_SEL_SINGLE or JST_SEL_MULTIPLE (JST_SEL_MULTI is a possible alias). When selection is used, it is possible to determine the control names using the selectionName property. So, if the table is in a form, when it is submitted, the selection will be sent together.


There are several callbacks that may be used to respond to table events: