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. Backup &recovery备份和还原

    实践版本:MySQL5.7 备份类型(backup type)物理和逻辑备份(Physical Versus Logical Backup)        物理备份是指直接复制存储数据库内容的目录和文 ...

  2. PHP----------线程安全和非线程安全的介绍

    1.Linux下的PHP,没有线程安全版和非线程安全版之分.从2000年10月20日发布的第一个Windows版的PHP3.0.17开始的都是线程安全的版本,直至5.2.1版本开始有Thread Sa ...

  3. org.springframework.beans.factory.BeanCreationException: Error creating bean with name 'dataSource' defined in class path resource [app2.xml]: Instantiation of bean failed; nested exception is org.spr

    在学习spring整合hubernate时遇到的问题.c3p0遇到了一个问题,老连不上,显示java.lang.NoClassDefFoundError:com.mchange.v2.ser.Indi ...

  4. linux-git

  5. SV-assertion

    断言(assert)是一种描述性语言,通过描述的期望结果来进行仿真验证. 断言有一个更加基础的信息,我们称为属性(property),属性可以作为断言结果,功能覆盖点,形式检查和约束随机激励生成. 断 ...

  6. Spring Cloud Gateway Ribbon 自定义负载均衡

    在微服务开发中,使用Spring Cloud Gateway做为服务的网关,网关后面启动N个业务服务.但是有这样一个需求,同一个用户的操作,有时候需要保证顺序性,如果使用默认负载均衡策略,同一个用户的 ...

  7. ubuntu16.04+ROS安装kinectV1

    1.安装驱动 安装ROS软件包以下2种方式,任选一种即可,当然全部安装也没有问题 1)使用openni_launch sudo apt-get install ros-kinetic-openni-c ...

  8. Spring boot 源码分析(一)SpringApplication.run(上)

    SpringApplication.run(Main.class, args); 从这个方法开始讲吧: public static ConfigurableApplicationContext run ...

  9. JS根据屏幕分辨率改变背景宽高

    //控制浏览器显示的高宽 function document_loaded() { GotoMainStep(); /; document.getElementById("main1&quo ...

  10. java 接口详解

    定义接口 接口继承和实现继承的规则不同,一个类只有一个直接父类,但可以实现多个接口.Java 接口本身没有任何实现,只描述 public 行为,因此 Java 接口比 Java 抽象类更抽象化.Jav ...