jQuery EasyUI 数据网格 - 创建列组合

jQuery EasyUI 教程 · 2019-04-06 15:39:03

easyui 的数据网格（DataGrid）可以创建列组合，如下所示：

在本实例中，我们使用平面数据来填充数据网格（DataGrid）的数据，并把 listprice、unitcost、addr1、status 列组合在一个单一的列下。

为了创建列组合，您应该定义数据网格（datagrid）插件的 columns 数据。列的每个元素是定义一组可使用 rowspan 或 colspan 属性来进行组合的单元格。

下面的代码实现了上面的实例：

    <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>

下载 jQuery EasyUI 实例

jeasyui-datagrid-datagrid9.zip

点击查看所有 jQuery EasyUI 教程文章: https://codercto.com/courses/l/42.html

查看所有标签

码农书籍

C程序设计语言

Brian W. Kernighan、Dennis M. Ritchie / 机械工业出版社 / 2006-8-1 / 35.00元

在计算机发展的历史上，没有哪一种程序设计语言像C语言这样应用广泛。本书是C语言的设计者之一Dennis M.Ritchie和著名计算机科学家Brian W.Kernighan合著的一本介绍C语言的权威经典著作。我们现在见到的大量论述C语言程序设计的教材和专著均以此书为蓝本。本书第1版中介绍的C语言成为后来广泛使用的C语言版本——标准C的基础。人们熟知的“hello,World"程序就是由本书首次引......一起来看看《C程序设计语言》这本书的介绍吧!

码农工具

话题

教程

Tips

#include <iostream>
using namespace std;
int main()
{
    cout<<"Hello, World!"<<flush;
    return 0;
}

jQuery EasyUI 数据网格 - 创建列组合

下载 jQuery EasyUI 实例

C程序设计语言

HTML 压缩/解压工具

随机密码生成器

HTML 编码/解码