1、源码 BorderContainer.html: !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"html head titleBorderContainer/title meta http-equiv="keywords" content="keyword1,keyword2,keyword3" meta http-equiv="description" content="this
1、源码
BorderContainer.html:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>BorderContainer</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="this is my page"> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="stylesheet" type="text/css" href="../dojoroot/dijit/themes/tundra/tundra.css"/> <script type="text/javascript" src="../dojoroot/dijit/tests/boilerplate.js"></script> </head> <body class="claro" role="main"> <div data-dojo-type="dijit/layout/BorderContainer" data-dojo-props='style:"width: 1000px; height: 300px; border: 2px solid blue;"'> <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props='region:"top", style:"background-color: #99DD00; border: 1px black solid; height: 20px;", splitter:true'> <table style="width:100%;"> <tr> <td> <label>开始时间:</label> <input type="text" data-dojo-type="dijit/form/DateTextBox" data-dojo-id="startDate" data-dojo-props='style:"width:100px;"'/> </td> <td> <label>结束时间:</label> <input type="text" data-dojo-type="dijit/form/DateTextBox" data-dojo-id="endDate" data-dojo-props='style:"width:100px;"'/> </td> <td> <button data-dojo-type="dijit/form/Button" data-dojo-id="searchBtn" data-dojo-props='type:"button", label:"original", "class":"mblRedButton"'>查询</button> </td> <td style="width:40%;"> </td> </tr> </table> </div> <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props='region:"center", style:"background-color: #DDAA00; border: 1px black solid;", splitter:true'> <span dojoType="dojo/data/ItemFileWriteStore" data-dojo-id="jsonStore" url="student.json"> </span> <table dojoType="dojox/grid/DataGrid" data-dojo-id="grid" id="grid" store="jsonStore" query="{ name: '*' }" data-dojo-props='style:"height:300px;width:100%;"'> <thead> <tr> <th field="name" width="500px">姓名</th> <th field="age" width="500px">年龄</th> <th field="sex" width="500px">性别</th> </tr> </thead> </table> </div> <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props='region:"bottom", style:"background-color: #00DDDD; border: 1px black solid; height: 50px;", splitter:true'> </div> </div> </body> </html>2、数据源
student.json:
{ "identifier": "id", "label": "name", "items": [ { "id": "studen0", "name":"张三", "age":"23", "sex":"男"}, { "id": "studen1", "name":"李思", "age":"21", "sex":"女"}, { "id": "studen2", "name":"魏武", "age":"22", "sex":"男"}, { "id": "studen3", "name":"朱珠", "age":"20", "sex":"女"}, { "id": "studen4", "name":"赵启", "age":"19", "sex":"男"}, { "id": "studen5", "name":"李婷", "age":"22", "sex":"女"}, { "id": "studen6", "name":"刘涛", "age":"18", "sex":"男"}, { "id": "studen7", "name":"孙婷", "age":"24", "sex":"女"}, { "id": "studen8", "name":"郑武", "age":"23", "sex":"男"}, { "id": "studen9", "name":"秋香", "age":"20", "sex":"女"} ]}