jQuery EasyUI 数据网格 - 动态改变列

  数据网格(DataGrid)列可以使用 'columns' 属性简单地定义。如果您想动态地改变列,那根本没有问题。为了改变列,您可以重新调用datagrid 方法,并传递一个新的 columns 属性。

  创建数据网格(DataGrid)

  

  url="data/datagrid_data.json"

  singleSelect="true" iconCls="icon-save">

  

  $('#tt').datagrid({

  columns:[[

  {field:'itemid',title:'Item ID',width:80},

  {field:'productid',title:'Product ID',width:80},

  {field:'attr1',title:'Attribute',width:200},

  {field:'status',title:'Status',width:80}

  ]]

  });

  运行网页,您将看见:

  可是有时候您想改变列,所以您需要写一些代码:

  $('#tt').datagrid({

  columns:[[

  {field:'itemid',title:'Item ID',width:80},

  {field:'productid',title:'Product ID',width:80},

  {field:'listprice',title:'List Price',width:80,align:'right'},

  {field:'unitcost',title:'Unit Cost',width:80,align:'right'},

  {field:'attr1',title:'Attribute',width:100},

  {field:'status',title:'Status',width:60}

  ]]

  });

  请记住,我们已经定义了其他属性,比如:url、width、height 等等。我们不需要再一次定义它们,我们定义那些我们需要改变的。

  下载 jQuery EasyUI 实例

  jeasyui-datagrid-datagrid6.zip

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

雷林鹏分享:jQuery EasyUI 数据网格 - 动态改变列的更多相关文章

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

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

  2. 扩展jQuery easyui datagrid增加动态改变列编辑的类型

    $.extend($.fn.datagrid.methods, { addEditor : function(jq, param) { if (param instanceof Array) { $. ...

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

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

  4. 雷林鹏分享:jQuery EasyUI 数据网格 - 创建复杂工具栏

    jQuery EasyUI 数据网格 - 创建复杂工具栏 数据网格(datagrid)的工具栏(toolbar)可以包含按钮及其他组件. 您可以通个一个已存在的 DIV 标签来简单地定义工具栏布局,该 ...

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

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

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

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

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

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

  8. 雷林鹏分享:jQuery EasyUI 数据网格 - 自定义排序

    jQuery EasyUI 数据网格 - 自定义排序 如果默认的排序行为不满足您的需求,您可以自定义数据网格(datagrid)的排序行为. 最基础的,用户可以在列上定义一个排序函数,函数名是 sor ...

  9. 雷林鹏分享:jQuery EasyUI 数据网格 - 自定义分页

    jQuery EasyUI 数据网格 - 自定义分页 数据网格(datagrid)内置一个很好特性的分页功能,自定义也相当简单.在本教程中,我们将创建一个数据网格(datagrid),并在分页工具栏上 ...

随机推荐

  1. 深入理解MVC原理

    SpringMVC的工作原理图: SpringMVC流程 1.  用户发送请求至前端控制器DispatcherServlet. 2.  DispatcherServlet收到请求调用HandlerMa ...

  2. #WEB安全基础 : HTTP协议 | 0x10 扩展HTTP报文结构概念和内容编码

    #以后的知识都是HTTP协议的扩展,如果精力有限可以选择暂时忽略,注意只是暂时忽略,以后的东西同样重要 HTTP传输数据时可以直接传输也可以对数据进行编码,由于编码在计算机内运行,所以会占用一些CPU ...

  3. pyppeteer(python版puppeteer)基本使用

    一.前言 以前使用selenium的无头浏览器,自从phantomjs2016后慢慢不更新了之后,selenium也开始找下家,这时候谷歌的chrome率先搞出来无头浏览器并开放了各种api,随后fi ...

  4. 灵雀云:etcd 集群运维实践

    [编者的话]etcd 是 Kubernetes 集群的数据核心,最严重的情况是,当 etcd 出问题彻底无法恢复的时候,解决问题的办法可能只有重新搭建一个环境.因此围绕 etcd 相关的运维知识就比较 ...

  5. LR参数化取值规则总结

    我想使用参数化输入设置10个并发用户循环1000次,第一个用户使用参数列表中的前1000个参数(第依次循环使用第一个参数.第二次循环使用第二个参数,依次类推).第二个用户使用参数列表中的2001-30 ...

  6. 利用airbase-ng建立Soft AP

    利用airbase-ng建立Soft AP,再利用一些常见工具进行嗅探,或对抓包进行分析是出现比较早的一种MITM攻击方法.网上有很多关于手动实现的文章,也有一些自动实现脚本.这些脚本通常分两类,一类 ...

  7. connect设置连接超时

    转自:庖丁解牛 /** * connect_timeout - 带超时的connect(方法中已执行connect) * @fd:文件描述符 * @addr:地址结构体指针 * @wait_secon ...

  8. OGG 18.1 for mysql远程捕获测试

    Ogg18.1 remote capture要求mysql为5.7版本,只能从linux远程捕获mysql on windows or linux,且不支持DDL捕获.支持远程mysql为commun ...

  9. npm命令

    简介:npm(node.js package manager)是Node.js的包管理器 .它创建于2009年,作为一个 开源项目,帮助开发人员轻松共享打包的代码模块 ## 默认方式初始化npm.(进 ...

  10. JS动态添加行列

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Add-Delete Row.a ...