dojo的grid组件，其功能还是很强大的，我主要用到两种方式：
View Code
1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
2 <html>
3 <head>
4 <title>Test dojox.grid.DataGrid Basic Editing</title>
5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"></meta>
6 <style type="text/css">
7 @import "http://www.cnblogs.com/../dojo/resources/dojo.css";
8 @import "../resources/Grid.css";
9 @import "../resources/tundraGrid.css";
10 body {
11 font-size: 0.9em;
12 font-family: Geneva, Arial, Helvetica, sans-serif;
13 }
14 .heading {
15 font-weight: bold;
16 padding-bottom: 0.25em;
17 }
18 #grid, #grid2 {
19 65em;
20 height: 25em;
21 padding: 1px;
22 }
23 </style>
24 <script>
25 //定义grid的结构
26 ModelGridLayout = [{
27 cells: [
28 { name:'<div style=" float:left;20px;height:20px;">second</div>',
29 field: 'name', editable: true, '300px', cellStyles:
30 'text-decoration: none; cursor:default; ',
31 headerStyles: 'text-align: center;' },
32 { name:'first',
33 field: 'area', editable: true, 'auto', cellStyles:
34 'text-decoration: none; cursor:default; ',
35 headerStyles: 'text-align: center;'},
36 ] ,
37 }];
38 </script>
39
40 <script type="text/javascript" src="http://www.cnblogs.com/../dojo/dojo.js"
41 djConfig="isDebug:true, parseOnLoad: true">
42
43 </script>
44 <script type="text/javascript">
45 dojo.require("dijit.dijit");
46 dojo.require("dojox.grid.DataGrid");
47 dojo.require("dojo.data.ItemFileWriteStore");
48 dojo.require("dojo.parser");
49 </script>
50
51 <script type="text/javascript" src="support/test_data.js"></script>
52 </head>
53 <body class="tundra">
54 <div class="heading">dojox.grid.DataGrid Basic Editing Test</div>
55 <span dojoType="dojo.data.ItemFileWriteStore"
56 jsId="jsonStore" url="http://www.cnblogs.com/../dijit/tests/_data/countries.json">
57 </span>
58 <table dojoType="dojox.grid.DataGrid"
59 jsid="grid" id="grid"
60 store="jsonStore" query="{ name: '*' }" rowsPerPage="20" rowSelector="20px">
61 <thead>
62 <tr>
63 <th field="name" width="300px">Country/Continent Name</th>
64 <th field="type" width="auto" cellType="dojox.grid.cells.Select"
65 options="country,city,continent"
66 editable="true">Type</th>
67 </tr>
68 </thead>
69 </table>
70
71 <div dojoType="dojox.grid.DataGrid"
72 jsid="grid1" id="grid1"
73 store="jsonStore" query="{ name: '*' }" style="800px" structure=ModelGridLayout
74 rowSelector="20px"></div>
75
76 </body>
77 </html>