Mega Code Archive

 
Categories / JavaScript DHTML / GUI Components
 

One page two grid (Table)

<html> <head>   <title>ActiveWidgets Grid :: Examples</title>   <style> body, html {font: menu; background: threedface;} </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>     #grid1 {height: 200px; border: 2px inset; background: white}     #grid2 {height: 100px; border: 2px inset; background: white}     #grid1 .active-column-1 {width: 200px; background-color: threedlightshadow;}     #grid2 .active-column-1 {width: 150px; background-color: infobackground;}     .active-column-2 {text-align: right;}     .active-column-3 {text-align: right;}     .active-column-4 {text-align: right;}     .active-grid-row {border-bottom: 1px solid threedlightshadow;}     .active-grid-column {border-right: 1px solid threedlightshadow;}   </style>   <!-- grid data -->   <script>     var data1 = [       ["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"],     ];     var data2 = [       ["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 columns1 = [       "Ticker", "Company Name", "Market Cap.", "$ Sales", "Employees"     ];     var columns2 = [       "Ticker(2)", "Company Name(2)", "Market Cap.(2)", "$ Sales(2)", "Employees(2)"     ];   </script> </head> <body>   <p>     Here is the first grid:   </p>   <script>     var obj1 = new Active.Controls.Grid;     obj1.setId("grid1");     obj1.setRowProperty("count", 15);     obj1.setColumnProperty("count", 5);     obj1.setDataProperty("text", function(i, j){return data1[i][j]});     obj1.setColumnProperty("text", function(i){return columns1[i]});     document.write(obj1);   </script>   <p>     And another one...   </p>   <script>     var obj2 = new Active.Controls.Grid;     obj2.setId("grid2");     obj2.setRowProperty("count", 5);     obj2.setColumnProperty("count", 5);     obj2.setDataProperty("text", function(i, j){return data2[i][j]});     obj2.setColumnProperty("text", function(i){return columns2[i]});     document.write(obj2);   </script> </body> </html>                          ActiveWidgets.zip( 344 k)