XML data island example (2.0b1)
Here is an example of using XML data island for 2.0b1 (IE only):
<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: 100%; 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>
<xml id="xmlDataIsland">
<companies>
<company>
<ticker>MSFT</ticker>
<name>Microsoft Corporation</name>
<mktcap>314,571.156</mktcap>
<sales>32,187.000</sales>
<employees>55000</employees>
</company>
<company>
<ticker>ORCL</ticker>
<name>Oracle Corporation</name>
<mktcap>62,615.266</mktcap>
<sales>9,519.000</sales>
<employees>40650</employees>
</company>
<company>
<ticker>SAP</ticker>
<name>SAP AG (ADR)</name>
<mktcap>40,986.328</mktcap>
<sales>8,296.420</sales>
<employees>28961</employees>
</company>
<company>
<ticker>CA</ticker>
<name>Computer Associates Inter</name>
<mktcap>15,606.335</mktcap>
<sales>3,164.000</sales>
<employees>16000</employees>
</company>
<company>
<ticker>ERTS</ticker>
<name>Electronic Arts Inc.</name>
<mktcap>14,490.895</mktcap>
<sales>2,503.727</sales>
<employees>4000</employees>
</company>
</companies>
</xml>
<script>
// create ActiveWidgets data model - XML-based table
var table = new AW.XML.Table;
// get reference to the xml data island node
var xml, node = document.getElementById("xmlDataIsland");
// IE
if (window.ActiveXObject) {
xml = node;
}
// Mozilla
else {
xml = document.implementation.createDocument("","", null);
xml.appendChild(node.selectSingleNode("*"));
}
// provide data XML
table.setXML(xml);
// 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);
obj.setRowCount(5);
// provide column labels
obj.setHeaderText(columns);
// provide external model as a grid data source
obj.setCellModel(table);
// write grid html to the page
document.write(obj);
</script>
</body>
</html>
Alex (ActiveWidgets)
October 20,