<html>
<head>
<title>ActiveWidgets Examples</title>
<style>body {font: 12px Tahoma}</style>
<!-- include links to the script and stylesheet files -->
<script src="./runtime/lib/aw.js"></script>
<link href="./runtime/styles/system/aw.css" rel="stylesheet"></link>
<!-- change default styles, set control size and position -->
<style>
#myGrid {height: 220px; width: 100%;} /* 设置Grid宽度高度 */
#myGrid .aw-alternate-even {background: #efe} /* 设置奇数行颜色 */
#myGrid .aw-alternate-odd {background: #def} /* 设置偶数行颜色 */
#myGrid .aw-grid-row {border-bottom: 1px dashed #ccc} /* 设置行边的虚线 */
#myGrid .aw-mouseover-row {background: #ccc} /* 设置划过行颜色 */
#myGrid .aw-grid-row {color: #000000} /* 设置行内容字体颜色 */
#myGrid .aw-column-0 {text-align: left} /* 设置列0为居左 */
#myGrid .aw-column-1 {text-align: center} /* 设置列1为居中 */
#myGrid .aw-column-2 {text-align: right} /* 设置列2为右对齐 */
</style>
</head>
<body>
<!-- insert control tag -->
<span id="myGrid"></span><br>
<span id="myLabel"></span>
<p>
<script>
var myData = [
[1, "World", 1018057389, 2005, "world"],
[2, "European Union", 247000000, 2006, "eu"],
[3, "United States", 205326680, 2005, "us"],
[4, "China", 123000000, 2006, "cn"],
[5, "Japan", 86300000, 2005, "jp"],
[6, "India", 60000000, 2005, "in"],
[7, "Germany", 50616000, 2006, "de"],
[8, "United Kingdom", 37600000, 2005, "gb"],
[9, "Korea South", 33900000, 2005, "kr"],
[10, "France", 29945000, 2006, "fr"] // no comma in the last line
];
var myHeaders = ["Id","Rank", "Country", "Internet users", "Data from"];
var grid = new AW.UI.Grid;
grid.setId("myGrid");
grid.setHeaderText(myHeaders);
grid.setCellData(myData);
grid.setColumnCount(5);
grid.setRowCount(10);
grid.setSelectorVisible(true);
grid.setSelectorWidth(50);
grid.setSelectorText(function(r){return this.getRowPosition(r)+1}); // 加载行标号
grid.setSelectionMode("multi-row-marker"); // 列中加入checkboxes
grid.refresh();
var label = new AW.UI.Label;
label.setId("myLabel");
label.refresh();
grid.onSelectedRowsChanged = function(rowIndicesArray){
label.setControlText("rows: [" + rowIndicesArray + "]");
var c= "["+rowIndicesArray+"]";
alert(c.length);
}
</script>
</p>
</body>
</html>
别忘记加runtime这个文件包
不次于Extjs Grid这个
<head>
<title>ActiveWidgets Examples</title>
<style>body {font: 12px Tahoma}</style>
<!-- include links to the script and stylesheet files -->
<script src="./runtime/lib/aw.js"></script>
<link href="./runtime/styles/system/aw.css" rel="stylesheet"></link>
<!-- change default styles, set control size and position -->
<style>
#myGrid {height: 220px; width: 100%;} /* 设置Grid宽度高度 */
#myGrid .aw-alternate-even {background: #efe} /* 设置奇数行颜色 */
#myGrid .aw-alternate-odd {background: #def} /* 设置偶数行颜色 */
#myGrid .aw-grid-row {border-bottom: 1px dashed #ccc} /* 设置行边的虚线 */
#myGrid .aw-mouseover-row {background: #ccc} /* 设置划过行颜色 */
#myGrid .aw-grid-row {color: #000000} /* 设置行内容字体颜色 */
#myGrid .aw-column-0 {text-align: left} /* 设置列0为居左 */
#myGrid .aw-column-1 {text-align: center} /* 设置列1为居中 */
#myGrid .aw-column-2 {text-align: right} /* 设置列2为右对齐 */
</style>
</head>
<body>
<!-- insert control tag -->
<span id="myGrid"></span><br>
<span id="myLabel"></span>
<p>
<script>
var myData = [
[1, "World", 1018057389, 2005, "world"],
[2, "European Union", 247000000, 2006, "eu"],
[3, "United States", 205326680, 2005, "us"],
[4, "China", 123000000, 2006, "cn"],
[5, "Japan", 86300000, 2005, "jp"],
[6, "India", 60000000, 2005, "in"],
[7, "Germany", 50616000, 2006, "de"],
[8, "United Kingdom", 37600000, 2005, "gb"],
[9, "Korea South", 33900000, 2005, "kr"],
[10, "France", 29945000, 2006, "fr"] // no comma in the last line
];
var myHeaders = ["Id","Rank", "Country", "Internet users", "Data from"];
var grid = new AW.UI.Grid;
grid.setId("myGrid");
grid.setHeaderText(myHeaders);
grid.setCellData(myData);
grid.setColumnCount(5);
grid.setRowCount(10);
grid.setSelectorVisible(true);
grid.setSelectorWidth(50);
grid.setSelectorText(function(r){return this.getRowPosition(r)+1}); // 加载行标号
grid.setSelectionMode("multi-row-marker"); // 列中加入checkboxes
grid.refresh();
var label = new AW.UI.Label;
label.setId("myLabel");
label.refresh();
grid.onSelectedRowsChanged = function(rowIndicesArray){
label.setControlText("rows: [" + rowIndicesArray + "]");
var c= "["+rowIndicesArray+"]";
alert(c.length);
}
</script>
</p>
</body>
</html>
别忘记加runtime这个文件包
不次于Extjs Grid这个