<html>
<head>
<title>ActiveWidgets Grid :: Examples</title>
<style> body, html {margin:0px; padding: 0px; overflow: hidden;} </style>
<!-- ActiveWidgets stylesheet and scripts -->
<link href="../../runtime/styles/xp/aw.css" rel="stylesheet" type="text/css" ></link>
<script src="../../runtime/lib/aw.js"></script>
<!-- grid format -->
<style>
.aw-grid-control {height: 80%; width: 100%; border: none; font: menu;}
.aw-column-0 {width: 80px;}
.aw-column-1 {width: 200px; background-color: threedlightshadow;}
.aw-column-2 {text-align: right;}
.aw-column-3 {text-align: right;}
.aw-column-4 {text-align: right;}
.aw-grid-cell {border-right: 1px solid threedshadow;}
.aw-grid-row {border-bottom: 1px solid threedlightshadow;}
</style>
</head>
<body>
<script>
// create ActiveWidgets data model - XML-based table
var table = new AW.XML.Table;
// provide data URL
table.setURL("../data/companies-simple.xml");
// start asyncronous data retrieval
table.request();
// define column labels
var columns = ["Ticker", "Company Name", "Market Cap.", "$ Sales", "Employees"];
// create ActiveWidgets Grid javascript object
var obj = new AW.UI.Grid;
obj.setColumnCount(5);
// provide column labels
obj.setHeaderText(columns);
// enable row selectors
obj.setSelectorVisible(true);
obj.setSelectorText(function(i){return this.getRowPosition(i)});
obj.setSelectorWidth(25);
// set row selection
obj.setSelectionMode("single-row");
// define data formats
var str = new AW.Formats.String;
var num = new AW.Formats.Number;
obj.setCellFormat([str, str, num, num, num]);
// provide external model as a grid data source
obj.setCellModel(table);
// write grid html to the page
document.write(obj);
var button = new AW.UI.Button;
button.setControlText("Refresh Table Data");
button.onClick = function() {
table.request();
}
document.write(button);
</script>
</body>
</html>
table.response = function(xml){
this.setXML(xml);
if (this.$owner) {
/*
this.$owner.clearScrollModel();
this.$owner.clearSelectionModel();
this.$owner.clearSortModel();
this.$owner.clearRowModel();
*/
this.$owner.setRowCount(this.getCount());
this.$owner.refresh();
}
};
This topic is archived.