原創(chuàng)|使用教程|編輯:龔雪|2016-01-28 09:13:37.000|閱讀 501 次
概述:本文主要為大家介紹如何在數(shù)據(jù)網(wǎng)格中創(chuàng)建列組。
# 界面/圖表報表/文檔/IDE等千款熱門軟控件火熱銷售中 >>
相關(guān)鏈接:
Kendo UI for jQuery——創(chuàng)建現(xiàn)代Web應(yīng)用程序的最完整UI庫!查看詳情>>>
該easyui的數(shù)據(jù)網(wǎng)格可以創(chuàng)建列組合,如下所示:
在本實(shí)例中,我們使用平面數(shù)據(jù)來填充數(shù)據(jù)網(wǎng)格的數(shù)據(jù),并把listprice、unitcost、addr1、status列組合在一個單一的列下。
為了創(chuàng)建列組合,您應(yīng)該定義數(shù)據(jù)網(wǎng)格插件的columns數(shù)據(jù)。列的每個元素是定義一組可使用rowspan或colspan屬性來進(jìn)行組合的單元格。
下面的代碼實(shí)現(xiàn)上面的例子:
<table id="tt" title="Column Group" class="easyui-datagrid" style="width:550px;height:250px" url="data/datagrid_data.json" singleSelect="true" iconCls="icon-save" rownumbers="true"> <thead> <tr> <th rowspan="2" field="itemid" width="80">Item ID</th> <th rowspan="2" field="productid" width="80">Product ID</th> <th colspan="4">Item Details</th> </tr> <tr> <th field="listprice" width="80" align="right">List Price</th> <th field="unitcost" width="80" align="right">Unit Cost</th> <th field="attr1" width="100">Attribute</th> <th field="status" width="60" align="center">Stauts</th> </tr> </thead> </table>
下載該EasyUI示例:
購買最新正版授權(quán)!""
本站文章除注明轉(zhuǎn)載外,均為本站原創(chuàng)或翻譯。歡迎任何形式的轉(zhuǎn)載,但請務(wù)必注明出處、不得修改原文相關(guān)鏈接,如果存在內(nèi)容上的異議請郵件反饋至chenjj@fc6vip.cn
文章轉(zhuǎn)載自:慧都控件網(wǎng)