<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-grid-column {border-right: 1px solid threedshadow;} .active-grid-row {border-bottom: 1px solid threedlightshadow;} </style>
<!-- grid data --> <script> var myData = [ ["MSFT","Microsoft Corporation", "314,571.156", "32,187.000", "55000"], ["ORCL", "Oracle Corporation", "62,615.266", "9,519.000", "40650"], ["SAP", "SAP AG (ADR)", "40,986.328", "8,296.420", "28961"], ["CA", "Computer Associates Inter", "15,606.335", "3,164.000", "16000"], ["ERTS", "Electronic Arts Inc.", "14,490.895", "2,503.727", "4000"], ["SFTBF", "Softbank Corp. (ADR)", "14,485.840", ".000", "6865"], ["VRTS", "Veritas Software Corp.", "14,444.272", "1,578.658", "5647"], ["SYMC", "Symantec Corporation", "9,932.483", "1,482.029", "4300"], ["INFY", "Infosys Technologies Ltd.", "9,763.851", "830.748", "15400"], ["INTU", "Intuit Inc.", "9,702.477", "1,650.743", "6700"], ["ADBE", "Adobe Systems Incorporate", "9,533.050", "1,230.817", "3341"], ["PSFT", "PeopleSoft, Inc.", "8,246.467", "1,941.167", "8180"], ["SEBL", "Siebel Systems, Inc.", "5,434.649", "1,417.952", "5909"], ["BEAS", "BEA Systems, Inc.", "5,111.813", "965.694", "3063"], ["SNPS", "Synopsys, Inc.", "4,482.535", "1,169.786", "4254"], ["CHKP", "Check Point Software Tech", "4,396.853", "424.769", "1203"], ["MERQ", "Mercury Interactive Corp.", "4,325.488", "444.063", "1822"], ["DOX", "Amdocs Limited", "4,288.017", "1,427.088", "9400"], ["CTXS", "Citrix Systems, Inc.", "3,946.485", "554.222", "1670"], ["KNM", "Konami Corporation (ADR)", "3,710.784", ".000", "4313"] ];
var myColumns = [ "Ticker", "Company Name", "Market Cap.", "$ Sales", "Employees" ]; </script> </head> <body> <script>
// create ActiveWidgets Grid javascript object var obj = new Active.Controls.Grid;
// set number of rows/columns obj.setRowProperty("count", 20); obj.setColumnProperty("count", 5);
// provide cells and headers text obj.setDataProperty("text", function(i, j){return myData[i][j]}); obj.setColumnProperty("text", function(i){return myColumns[i]});
// set headers width/height obj.setRowHeaderWidth("28px"); obj.setColumnHeaderHeight("20px");
// set click action handler obj.setAction("click", function(src){window.status = src.getItemProperty("text")});
function myColor(){ var value = this.getItemProperty("value"); return value > 10000 ? "red" : "blue"; }
obj.getColumnTemplate(4).setStyle("color", myColor);
// write grid html to the page document.write(obj);
</script> </body> </html>
|