Page tree
Skip to end of metadata
Go to start of metadata

You are viewing an old version of this page. View the current version.

Compare with Current View Page History

Version 1 Next »

Spread.Sheets supports binding to array objects and Knockout.observableArray. Spread.Sheets also supports cell-level binding, which allows binding to any object.

Spread.Sheets supports two-way data binding.

Specific columns can be bound with the bindColumn method.

See the following topics for more information:

Using Code

This example binds specific columns with the bindColumn method.

JavaScript

Copy Code

var datasource = [
                   { name: "Alice", age: 27, birthday: "1985/08/31", position: "PM" },
                   { name: "Aimee", age: 28, birthday: "1984/07/31", position: "TL" },
                   { name: "Charles", age: 29, birthday: "1983/03/31", position: "QC" },
                   { name: "Fred", age: 30, birthday: "1982/02/20", position: "DL" },
                   { name: "Angelia", age: 31, birthday: "1981/05/30", position: "QC" },
                   { name: "Peter", age: 32, birthday: "1980/11/08", position: "QC" }
               ];
var nameColInfo = { name: "name", displayName: "Name", size: 70 };
var ageColInfo = { name: "age", displayName: "Age", size: 40, resizable: false };
var birthdayColInfo = { name: "birthday", displayName: "Birthday",formatter:"d/M/yy", size: 120 };
var positionColInfo = { name: "position", displayName: "Position", size: 50, visible: false };
activeSheet.autoGenerateColumns = true;
activeSheet.setDataSource(datasource);
activeSheet.bindColumn(0, nameColInfo);
activeSheet.bindColumn(1, ageColInfo);
activeSheet.bindColumn(2, birthdayColInfo);
activeSheet.bindColumn(3, positionColInfo);

Using Code

This example binds specific columns with the bindColumn method.

JavaScript

Copy Code

var test = [
        {"Series0":2,"Series1":1},
        {"Series0":4,"Series1":2},
        {"Series0":3,"Series1":4}
    ];

activeSheet.setDataSource(test);
activeSheet.bindColumn(1,"Series0");
activeSheet.bindColumn(0,"Series1");

Using Code

This example binds the sheet with the setDataSource method.

JavaScript

Copy Code

var test = [
        {"Series0":2,"Series1":1},
        {"Series0":4,"Series1":2},
        {"Series0":3,"Series1":4}
    ];

activeSheet.setDataSource(test, true);
//activeSheet.setDataSource(test);

Using Code

This example binds to a JSON array object.

JavaScript

Copy Code

var jasonArray = '{"phoneNumbers": [{"type": "home","number": "212 555-1234"},{"type": "fax","number": "646 555-4567"}]}';
var arr = JSON.parse(jasonArray);
activeSheet.setDataSource(arr.phoneNumbers);


See Also
Binding Tables

  • No labels