JavaScripTools Manual

JavaScripTable

Using objects and exporting data

The table is useful where you want the user to edit "child records", or edit multiple data at a time.

The question is: how to retrieve the data after the edition? There are 3 ways:

• Setting the selectionName and the name for each EditControl. So, when the form is submitted, the values may be retrieved at server side.
• Encoding data into a single string using the encode method. More details ahead.
• Retrieving the rows as objects using an ObjectRowMapper. Details ahead.

Encoding data into a single string

This is done by the encode method. It takes three optional parameters: The rows to encode (you may use, for example, the getSelectedRows method) - defaults to all rows, the columns (as a number array) - defaults to all, and a flag, indicating if the row identifier should be encoded or not - defaults to true.

A Parser is used for each column. It may be set a explicit parser using the column encodingParser property, or may by used a default parser according to the data type. The table has the following properties as default parsers (the default values are in parenthesis): stringEncodingParser (JST_DEFAULT_STRING_ENCODING_PARSER), numberEncodingParser (JST_DEFAULT_NUMBER_ENCODING_PARSER), currencyEncodingParser (JST_DEFAULT_CURRENCY_ENCODING_PARSER), dateEncodingParser (JST_DEFAULT_DATE_ENCODING_PARSER) and booleanEncodingParser (JST_DEFAULT_BOOLEAN_ENCODING_PARSER).

A separator is used between values (a single cell may contain multiple values) - valueSeparator (JST_DEFAULT_VALUE_SEPARATOR), between columns - columnSeparator (JST_DEFAULT_COLUMN_SEPARATOR) and between rows - rowSeparator (JST_DEFAULT_ROW_SEPARATOR).

Here is a brief example:

var table = new JavaScripTable(...);
var col;
table.addColumn(new Column("Name", JST_TYPE_STRING));
table.addColumn(new Column("Age", JST_TYPE_NUMBER));
table.addColumn(new Column("Married", JST_TYPE_BOOLEAN));
table.addRow(1, ["John", 38, true]);
table.addRow(2, ["Mary", 27, false]);
table.rowSeparator = "\n";
table.columnSeparator = ";";
table.encode(); -> "John;38;true\nMary;27;false";

Using an ObjectRowMapper

An ObjectRowMapper is a class that converts objects to rows and rows to objects.

There are 2 ways of setting an ObjectRowMapper: setting the table identifierName and each column propertyName properties, so an ObjectRowMapper will be created by the table, or manually setting the ObjectRowMapper instance. For example:

function Customer(id, name, age, married) {
    this.customerId = id;
    this.name = name;
    this.age = age;
    this.isMarried = married;
}
var table = ...; //Assume the same table as the encoding example

//First way: Using an implicit ObjectRowMapper
table.identifierName = "customerId";
//The propertyName could be assigned to the Column instance that is returned by addColumn
table.getColumnByIndex(0).propertyName = "name";
table.getColumnByIndex(1).propertyName = "age";
table.getColumnByIndex(2).propertyName = "isMarried";

//Second way: Using an explicit ObjectRowMapper
table.objectRowMapper = new ObjectRowMapper();
table.objectRowMapper.className = "Customer";
table.objectRowMapper.mapIdentifier("customerId");
table.objectRowMapper.mapProperty(0, "name");
table.objectRowMapper.mapProperty(1, "age");
table.objectRowMapper.mapProperty(2, "isMarried");

//Now you can retrieve rows as objects, or add rows as objects
table.getAllRowsAsObjects(); -> Returns 2 Customer instances
table.addRow(new Customer(3, "Peter", 68, true));
table.updateRow(new Customer(1, "John", 40, true));

If you are a Java developer and use Ajax, you could try, for example, to work with DWR (Direct Web Remoting), that allows you to pass JavaScript objects direct to Java. In this case, using an ObjectRowMapper is very useful.