dojo应用之dataGrid

最新推荐文章于 2017-05-07 20:07:00 发布

BingDuang

最新推荐文章于 2017-05-07 20:07:00 发布

阅读量3.6k

点赞数

CC 4.0 BY-SA版权

分类专栏： dojo 文章标签： datagrid dojo layer tcp prototype url

本文链接：https://blog.youkuaiyun.com/Icecream0/article/details/6166998

dojo 专栏收录该内容

4 篇文章

订阅专栏

本文提供了Dojo DataGrid的一个详细示例，展示了如何利用DataGrid实现分页、自定义单元格格式等功能，并附带了完整的代码及下载链接。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

这次项目中，应用例子的总结，该篇文章主要总结datagrid的使用方法。

代码如下：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <HTML> <HEAD> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <META HTTP-EQUIV="pragma" CONTENT="no-cache"> <mce:style type="text/css"></mce:style><style type="text/css" mce_bogus="1"> @import "../../../dojoroot/dojo/resources/dojo.css"; @import "../../../dojoroot/dojox/grid/resources/Grid.css"; @import "../../../dojoroot/dijit/themes/tundra/tundra.css"; body { font-size: 0.9em; font-family: Geneva, Arial, Helvetica, sans-serif; } .heading { font-weight: bold; padding-bottom: 0.25em; } #grid, #grid2 { width: 80%; height: 30em;//?? padding: 1px; } th {text-align:center;} </style> <mce:script type="text/javascript" src="../../../dojoroot/dojo/dojo.js" mce_src="dojoroot/dojo/dojo.js" djConfig="isDebug:false, parseOnLoad: true"></mce:script> <mce:script type="text/javascript" src="js/common.js" mce_src="js/common.js" ></mce:script> <mce:script type="text/javascript"></mce:script> <mce:script type="text/javascript"></mce:script> <mce:script type="text/javascript"></mce:script> </HEAD> <BODY class="tundra"> <div style="text-align:center;margin:auto" mce_style="text-align:center;margin:auto"><span id="pagelabel"></span></div> <BR> <TABLE CELLSPACING=0 CELLPADDING=2 BORDER=0 WIDTH="100%" BGCOLOR="#000000"> <TR> <TD><TABLE CELLSPACING=0 CELLPADDING=0 BORDER=0 WIDTH="100%" BGCOLOR="#FFFFFF">  <TR> <TD>  <div dojoType="dojox.grid.DataGrid" class="tundra" jsid="grid" id="grid" escapeHTMLInData="false" style="width:100%" store="jsonStore" query="{ id: '*' }" rowsPerPage="20" rowSelector="5px" structure="layoutFlickrData"> </div>  <input type="hidden" name="num_result_rows" id="num_result_rows" value="" ></input> <input type="hidden" name="current_view" id="current_view" value="" ></input> <input type="hidden" name="pagesize" id="pagesize" value="" ></input> </TD> </TR> <tr> <td>  <div style="padding: 0px; position: static; text-indent: 0px; padding: 0px;" mce_style="padding: 0px; position: static; text-indent: 0px; padding: 0px;" class="dojoxGridHeader" dojoAttachPoint="buttonBar"> <div style="width: 100%; text-indent: 0px; padding: 0px;" class="dojoxGridCell"> <button dojoType="dijit.form.Button" onClick="prevPage();" style="float: left;" mce_style="float: left;">prev</button> <button dojoType="dijit.form.Button" onClick="nextPage();" style="float: right" mce_style="float: right">next</button> <span id="pagenum" style="text-align:center" mce_style="text-align:center"> </span> </div> </div> </td> </tr> </TABLE></TD> </TR> </TABLE> <P> </P> </BODY> </HTML>

详情查看附件，附件包含源代码以及辅助代码

http://download.youkuaiyun.com/source/3005466

dojo datagrid分页例子：

http://download.youkuaiyun.com/source/3005473