jQuery EasyUI 数据网格 - 添加工具栏

jQuery EasyUI 教程 · 2019-04-06 13:17:48

本实例演示如何添加工具栏（toolbar）到数据网格（datagrid）。

创建数据网格（DataGrid）

    <table id="tt" class="easyui-datagrid" style="width:600px;height:250px"
            url="data/datagrid_data.json"
            title="DataGrid with Toolbar" iconCls="icon-save"
            toolbar="#tb">
        <thead>
            <tr>
                <th field="itemid" width="80">Item ID</th>
                <th field="productid" width="80">Product ID</th>
                <th field="listprice" width="80" align="right">List Price</th>
                <th field="unitcost" width="80" align="right">Unit Cost</th>
                <th field="attr1" width="150">Attribute</th>
                <th field="status" width="60" align="center">Stauts</th>
            </tr>
        </thead>
    </table>
    <div id="tb">
        <a href="#" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="javascript:alert('Add')">Add</a>
        <a href="#" class="easyui-linkbutton" iconCls="icon-cut" plain="true" onclick="javascript:alert('Cut')">Cut</a>
        <a href="#" class="easyui-linkbutton" iconCls="icon-save" plain="true" onclick="javascript:alert('Save')">Save</a>
    </div>

我们不需要写任何的 javascript 代码，只需通过 'toolbar' 属性附加工具栏（toolbar）到数据网格（datagrid）。

下载 jQuery EasyUI 实例

jeasyui-datagrid-datagrid4.zip

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

查看所有标签

码农书籍

程序员之禅

[德] Christian Grobmeier / 荣耀、朱艳 / 人民邮电出版社 / 2015-8 / 39.00元

禅是一种生活态度和生活方式。程序员是一份特别辛苦的职业，也是一个承受各种压力的群体。在物欲横流的今天，禅对于程序员有着特殊的意义和价值。本书的作者是一名德国程序员老兵，深谙程序员的喜怒哀乐。他曾经发表了一篇题为“程序员之禅的十条法则”的博客文章，引发众多程序员热烈的讨论和强烈的共鸣。本书共10章，结合程序员日常生活和工作的方方面面，作者通过对禅的知识、理解、体验、思考和感悟，提出很多中肯的......一起来看看《程序员之禅》这本书的介绍吧!

码农工具

文章

话题

教程

Tips

#include <stdio.h>
int main()
{
    printf("Hello, World!");
    return 0;
}

jQuery EasyUI 数据网格 - 添加工具栏

创建数据网格（DataGrid）

下载 jQuery EasyUI 实例

程序员之禅

MD5 加密

XML 在线格式化

RGB HSV 转换