// create ActiveWidgets data model - XML-based table
var table = new Active.XML.Table;
// provide data URL
table.setURL("../data/companies-simple.xml");
// provide image code
table.getImage = function(row, col){
// same for all rows
return "txt";
// if the image also stored in the XML then
// return this.getNode(row, col).getAttribute("image");
// or
// return this.getNode(row, col).selectSingleNode("xpath").text;
}
// start asyncronous data retrieval
table.request();
// create ActiveWidgets Grid javascript object
var obj = new Active.Controls.Grid;
// prepare image column template
var myColumn = new Active.Templates.Image;
// assing event handler to the image
myColumn.getContent("image").setEvent("onclick", function(){
this.action("myImageClicked");
});
// assign image template to the first column
obj.setColumnTemplate(myColumn, 0);
// create action handler, src is the reference to the action source
obj.setAction("myImageClicked", function(src){
var rowIndex = src.getItemProperty("index");
var someData = this.getDataProperty("value", rowIndex, 2);
alert(someData);
});
// define column labels
var columns = ["Ticker", "Company Name", "Market Cap.", "$ Sales", "Employees"];
// provide column labels
obj.setColumnProperty("texts", columns);
// provide external model as a grid data source
obj.setDataModel(table);
// write grid html to the page
document.write(obj);
This topic is archived.