jQuery EasyUI 数据网格 - 创建复杂工具栏

  数据网格(datagrid)的工具栏(toolbar)可以包含按钮及其他组件。 您可以通个一个已存在的 DIV 标签来简单地定义工具栏布局,该 DIV 标签将成为数据网格(datagrid)工具栏的内容。 本教程将向您展示如何创建数据网格(datagrid)组件的复杂工具栏。

  创建工具栏(Toolbar)

  

  

  

  

  

  

  

  

  

  Date From:

  To:

  Language:

  

  url="data/combobox_data.json"

  valueField="id" textField="text">

  Search

  

  

  创建数据网格(DataGrid)

  

  url="data/datagrid_data.json"

  title="DataGrid - Complex Toolbar" toolbar="#tb"

  singleSelect="true" fitColumns="true">

  

  

  

  

  

  

  

  

  

  

  

Item ID Product ID List Price Unit Cost Address Status

  正如您所看到的,数据网格(datagrid)的工具栏域对话框(dialog)相似。我们不需要写任何的 javascript 代码,就能创建带有复杂工具栏的数据网格(datagrid)。

  下载 jQuery EasyUI 实例

  jeasyui-datagrid-datagrid19.zip

  本文转载自:w3cschool(编辑:雷林鹏 来源:网络 侵删)

雷林鹏分享:jQuery EasyUI 数据网格 - 创建复杂工具栏的更多相关文章

  1. 雷林鹏分享:jQuery EasyUI 数据网格 - 创建列组合

    jQuery EasyUI 数据网格 - 创建列组合 easyui 的数据网格(DataGrid)可以创建列组合,如下所示: 在本实例中,我们使用平面数据来填充数据网格(DataGrid)的数据,并把 ...

  2. 雷林鹏分享:jQuery EasyUI 数据网格 - 创建自定义视图

    jQuery EasyUI 数据网格 - 创建自定义视图 在不同的情况下,您可能需要为数据网格(datagrid)运用更灵活的布局.对于用户来说,卡片视图(Card View)是个不错的选择.这个工具 ...

  3. 雷林鹏分享:jQuery EasyUI 数据网格 - 创建页脚摘要

    jQuery EasyUI 数据网格 - 创建页脚摘要 在本教程中,我们将向您展示如何在数据网格(datagrid)页脚显示摘要信息行. 为了显示页脚行,您应该设置 showFooter 属性为 tr ...

  4. 雷林鹏分享:jQuery EasyUI 数据网格 - 创建属性网格

    jQuery EasyUI 数据网格 - 创建属性网格 属性网格(property grid)带有一个内置的 expand(展开)/collapse(合并) 按钮,可以简单地为行分组.您可以简单地创建 ...

  5. 雷林鹏分享:jQuery EasyUI 数据网格 - 创建子网格

    jQuery EasyUI 数据网格 - 创建子网格 使用数据网格(datagrid)的详细视图,用户可以展开一行来显示附加的详细信息. 任何内容都可以加载作为行详细,子网格也可以动态加载. 本教程将 ...

  6. 雷林鹏分享:jQuery EasyUI 数据网格 - 设置冻结列

    jQuery EasyUI 数据网格 - 设置冻结列 本实例演示如何冻结一些列,当用户在网格上移动水平滚动条时,冻结列不能滚动到视图的外部. 为了冻结列,您需要定义 frozenColumns 属性. ...

  7. 雷林鹏分享:jQuery EasyUI 数据网格 - 动态改变列

    jQuery EasyUI 数据网格 - 动态改变列 数据网格(DataGrid)列可以使用 'columns' 属性简单地定义.如果您想动态地改变列,那根本没有问题.为了改变列,您可以重新调用dat ...

  8. 雷林鹏分享:jQuery EasyUI 数据网格 - 格式化列

    jQuery EasyUI 数据网格 - 格式化列 以下实例格式化在 easyui DataGrid 里的列数据,并使用自定义列的 formatter,如果价格小于 20 就将文本变为红色. 为了格式 ...

  9. 雷林鹏分享:jQuery EasyUI 数据网格 - 设置排序

    jQuery EasyUI 数据网格 - 设置排序 本实例演示如何通过点击列表头来排序数据网格(DataGrid). 数据网格(DataGrid)的所有列可以通过点击列表头来排序.您可以定义哪列可以排 ...

随机推荐

  1. 【论文速读】Lianwen_Jin_CVPR2017_Deep_Matching_Prior_Network_Toward_Tighter_Multi-oriented_Text_Detection

    Lianwen_Jin_CVPR2017_Deep_Matching_Prior_Network_Toward_Tighter_Multi-oriented_Text_Detection 作者 关键词 ...

  2. python安装pip的步骤记录

    因为重新装了系统,所以python所有的环境都要重新走一遍. 首先去python官网下载python最新版本.如果python没有自动加入环境变量的话就需要你自己手动加入.这个一般在安装python的 ...

  3. forms-隐藏处理

    获取pin码. 查看网页源码<form action="" method="post">    PIN:<br>    <inpu ...

  4. python爬取指定新闻

    作业的要求来自于:https://edu.cnblogs.com/campus/gzcc/GZCC-16SE2/homework/2894 给定一篇新闻的链接newsUrl,获取该新闻的全部信息 标题 ...

  5. Python-----多线程threading用法

    threading模块是Python里面常用的线程模块,多线程处理任务对于提升效率非常重要,先说一下线程和进程的各种区别,如图 概括起来就是 IO密集型(不用CPU) 多线程计算密集型(用CPU) 多 ...

  6. go语言开发教程之web项目开发实战

    Golang介绍Go语言是谷歌推出的一种全新的编程语言,可以在不损失应用程序性能的情况下降低代码的复杂性.谷歌首席软件工程师罗布派克(Rob Pike)说:我们之所以开发Go,是因为过去10多年间软件 ...

  7. MySQL 压缩文件安装遇到的问题及解决方案

    第一步:从官网下载压缩文件(链接). 第二步:解压该文件,放置到想放到的位置.我的目录是在 C:\mysql\mysql-8.0.12-winx64 下. 第三步:在C:\mysql\mysql-8. ...

  8. mysql基操

    创建数据表: create table tt1( id int, name varchar(20), age int,sex boolean ); insert into tt1 values(1,& ...

  9. BalkanOI 2018 Parentrises(贪心+基础DP)

    题意 https://loj.ac/problem/2713 思路 对于 \(\text{P1}\) 的档,首先可以看出 \(O(n^3)\) 的方法,即用 \(O(n^3)\) 的 \(\text{ ...

  10. Bytom Kit开发辅助工具介绍

    Bytom Kit是一款为了帮助开发者更简单地理解Bytom的开发辅助工具,集合了校验.标注.解码.测试水龙头等功能. 该工具用python语言封装了一套比原的API和7个工具方法,如果有开发需求可以 ...