<html> <head> <title>ActiveWidgets Grid :: Examples</title> <style> body, html {margin:0px; padding: 0px; overflow: hidden;} </style>
<!-- ActiveWidgets stylesheet and scripts --> <link href="gridRuntime/styles/classic/grid.css" rel="stylesheet" type="text/css" ></link> <script src="gridRuntime/lib/grid.js"></script>
<!-- grid format --> <style> .active-controls-grid {height: 100%; font: menu;}
.active-column-0 {width: 80px;} .active-column-1 {width: 200px; background-color: threedlightshadow;} .active-column-2 {text-align: right;} .active-column-3 {text-align: right;} .active-column-4 {text-align: right;} .active-column-5 {text-align: right;}
.active-grid-column {border-right: 1px solid threedshadow;} .active-grid-row {border-bottom: 1px solid threedlightshadow;} </style> </head> <body> <script>
// create data formats var string = new Active.Formats.String; var number1 = new Active.Formats.Number; var number2 = new Active.Formats.Number; var date = new Active.Formats.Date;
// define formatting rule for text output number1.setTextFormat("#,###.##"); number2.setTextFormat("");
date.setTextFormat("dd mmm yy"); date.setDataFormat("ISO8061");
// create ActiveWidgets data model - XML-based table var table = new Active.XML.Table;
// provide data URL table.setURL("gridExamples/data/companies-array.xml");
// define namespace for selecting column data table.setNamespace("co", "http://tempuri.org/");
// set column XPath table.setColumns(["co:ticker", "co:name", "co:marketcap", "co:sales", "co:employees", "co:timestamp"]);
// set column formatting table.setFormats([string, string, number1, number1, number2, date]);
// start asyncronous data retrieval table.request();
// define column labels var columns = ["Ticker", "Company Name", "Market Cap.", "$ Sales", "Employees", "Date"];
// create ActiveWidgets Grid javascript object var obj = new Active.Controls.Grid;
// 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);
</script> </body> </html>
|