zoukankan      html  css  js  c++  java
  • JQuery easyUI DataGrid 创建复杂列表头(译)

    » Create column groups in DataGrid

    The easyui DataGrid has ability to group columns, as the following example shows:

    In this example, we use flat data to populate the DataGrid data, and group the listprice,unitcost,addr1,status columns under a single column.

    To create column groups you should defines the columns property of datagrid plugin. Each element of columns is a definition of group which can use rowspan or colspan property to combine cells together.

    The following code implements above example:

     1 <table id="tt" title="Column Group" class="easyui-datagrid" style="550px;height:250px"  
     2         url="data/datagrid_data.json"  
     3         singleSelect="true" iconCls="icon-save" rownumbers="true">  
     4     <thead>  
     5         <tr>  
     6             <th rowspan="2" field="itemid" width="80">Item ID</th>  
     7             <th rowspan="2" field="productid" width="80">Product ID</th>  
     8             <th colspan="4">Item Details</th>  
     9         </tr>  
    10         <tr>  
    11             <th field="listprice" width="80" align="right">List Price</th>  
    12             <th field="unitcost" width="80" align="right">Unit Cost</th>  
    13             <th field="attr1" width="100">Attribute</th>  
    14             <th field="status" width="60" align="center">Stauts</th>  
    15         </tr>  
    16     </thead>  
    17 </table> 
  • 相关阅读:
    matlab cell
    matlab linux 快捷键设置——有问题还是要解决
    latex 小结
    TOJ 1258 Very Simple Counting
    TOJ 2888 Pearls
    HDU 1248 寒冰王座
    TOJ 3486 Divisibility
    TOJ 3635 过山车
    TOJ 1840 Jack Straws
    HDU 4460 Friend Chains
  • 原文地址:https://www.cnblogs.com/laogu2/p/4143898.html
Copyright © 2011-2022 走看看