SpreadJS allows you to bind the name, dataField, formatter, cellType, and convert function inside of a table column.
Use the bind method to bind the table to a field with records, and the table columns to the record's fields. When you set a different data source, the table will automatically bind to corresponding records. For example:
table.bind(tableColumns, 'sales', data);
We provide the bind API to solve complicated call issue; you can use it as shown in the below code:
Example 1:
var data = {
name: 'Jones', region: 'East',
sales: [
{orderDate: '1/6/2013', item: 'Pencil', units: 95, cost: 1.99, isMakeMoney: true},
{orderDate: '4/1/2013', item: 'Binder', units: 60, cost: 4.99, isMakeMoney: false},
{orderDate: '6/8/2013', item: 'Pen Set', units: 16, cost: 15.99, isMakeMoney: false}
]
};
var convert = function (item) {
return item['cost'] + '$';
}
var table = sheet.tables.add('tableSales', 0, 0, 5, 5);
var tableColumn1 = new spreadNS.Tables.TableColumn();
tableColumn1.name("Order Date");
tableColumn1.dataField("orderDate");
tableColumn1.formatter("d/M/yy");
var tableColumn2 = new spreadNS.Tables.TableColumn();
tableColumn2.name("Item");
tableColumn2.dataField("item");
var tableColumn3 = new spreadNS.Tables.TableColumn();
tableColumn3.name("Units");
tableColumn3.dataField("units");
var tableColumn4 = new spreadNS.Tables.TableColumn();
tableColumn4.name("Cost");
tableColumn4.dataField("cost");
tableColumn4.value(convert);
var tableColumn5 = new spreadNS.Tables.TableColumn();
tableColumn5.name("IsMakeMoney");
tableColumn5.dataField("isMakeMoney");
tableColumn5.cellType(new GC.Spread.Sheets.CellTypes.CheckBox());
table.autoGenerateColumns(false);
table.bind([tableColumn1, tableColumn2, tableColumn3, tableColumn4, tableColumn5], 'sales', data);
Example 2:
var data = {
name: 'Jones', region: 'East',
sales: [
{orderDate: '1/6/2013', item: 'Pencil', units: 95, cost: 1.99, isMakeMoney: true},
{orderDate: '4/1/2013', item: 'Binder', units: 60, cost: 4.99, isMakeMoney: false},
{orderDate: '6/8/2013', item: 'Pen Set', units: 16, cost: 15.99, isMakeMoney: false}
]
};
var convert = function (item) {
return item['cost'] + '$';
}
var table = sheet.tables.add('tableSales', 0, 0, 5, 5);
var tableColumn1 = new spreadNS.Tables.TableColumn(1, "orderDate", "Order Date", "d/M/yy");
var tableColumn2 = new spreadNS.Tables.TableColumn(2, "item", "Item");
var tableColumn3 = new spreadNS.Tables.TableColumn(3, "units", "Units");
var tableColumn4 = new spreadNS.Tables.TableColumn(4, "cost", "Cost", null, null, convert);
var tableColumn5 = new spreadNS.Tables.TableColumn(5, "isMakeMoney", "IsMakeMoney", null, new GC.Spread.Sheets.CellTypes.CheckBox());
table.autoGenerateColumns(false);
table.bind([tableColumn1, tableColumn2, tableColumn3, tableColumn4, tableColumn5], 'sales', data);
When you have already bound the data source, you can get the dirty table rows if you change the data source value:
var dirtyRows = table.getDirtyRows();
Submit and view feedback for