代码功能:

1、datagrid 的表头由后台生成,可以配置在数据库

2、datagrid 的列绑定数据 支撑嵌套对象

$(function() {
var columns = new Array();
var cols = new Array();
var colData = new Object(); $.post("url","params",function(data){
//动态生成表头开始
if(data.xxxx != null){
$.each(data.xxxx,function(){
colData = new Object();
colData.field = this.resCode;
colData.title = this.resName;
colData.width = 100;//也可以配置在数据库,这样整个页面的生成全部是配置的
colData.formatter = function(value,row,index){ //这两句是嵌套对象属性绑定,insideObject 为嵌套的对象,field 为对象的属性
//datagrid 的field不能重复,注意在绑定field 时不能全部用 insideObject,需要使用 insideObject 的属性绑定
var field = this.field;
return row.insideObject[field]; };
cols.push(colData);
});
};
columns.push(cols);
//动态生成表头结束 var gridCfg = {
fit : true,
loadMsg : '数据加载中......',
url : opts.resDataQueryUrl,
nowrap : true,
border : false,
striped : true,
pagination : true,
pageSize : opts.pageSize,
rownumbers : true,
singleSelect: false,
columns : columns,
fitColumns : false,
queryParams : {},
frozenColumns : [[
{field:'ck',checkbox:true}
]],
onLoadSuccess:function(data){
}
};
$('#id').datagrid(gridCfg); }); });

转载 -- jquery easyui datagrid 动态表头 + 嵌套对象属性展示的更多相关文章

  1. JQuery EasyUI DataGrid动态合并(标题)单元) 一

    JS: /** * EasyUI DataGrid根据字段动态合并单元格 * @param fldList 要合并table的id * @param fldList 要合并的列,用逗号分隔(例如:&q ...

  2. JQuery EasyUI DataGrid动态合并单元格

    /**        * EasyUI DataGrid根据字段动态合并单元格        * @param fldList 要合并table的id        * @param fldList ...

  3. JQuery EasyUI datagrid 复杂表头处理

    下面是我项目中和网上收集的EasyUI的表头处理的,合适的拿去用吧. 例子1: $('#day_health').datagrid({                 url: "sqb_b ...

  4. jquery easyui datagrid 动态 加载列

    实现方式: 首先根据输入的sql语句获得相关的列名称返回给前台,然后在datagrid中动态加载列,接着根据查询条件(包括sql语句)获取相关的记录返回给前台用于填充datagrid.从而实现类似or ...

  5. easyui datagrid 动态表头2

    前端 function goqry() { $("#form").form("submit", { url: "CJCK_bjcjfx_yfsl.as ...

  6. jquery easyui DataGrid 动态的改变列显示的顺序

    $.extend($.fn.datagrid.methods,{ columnMoving: function(jq){ return jq.each(function(){ var target = ...

  7. jquery easyui datagrid动态改变title的值

    title:'<input type="text" id="txtTitle1" style="background:none;border:n ...

  8. JQuery easyUi datagrid 中 editor 动态设置最大值最小值

    前言 近来项目中使用到 easyui 来进行页面设计,感觉挺方便的,但是网上除了api外,其他有价值的资料比较少,故在此分享一点经验,供大家参考.   问题 JQuery easyUi datagri ...

  9. Jquery easyui datagrid 导出Excel

    From:http://www.cnblogs.com/weiqt/articles/4022399.html datagrid的扩展方法,用于将当前的数据生成excel需要的内容. 1 <sc ...

随机推荐

  1. ABAQUS复合材料

    转自)http://meiniyuan.blog.sohu.com/134141022.html 有很多帖子相当的不错,介绍了复合材料研究的基本的原理和方法,发现好的帖子再更新:0 c3 n0 ~+ ...

  2. js 原生ajax实现

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  3. JAVA 垃圾收集算法,垃圾收集器与内存分配策略(内容全面,解析简单易懂)

    垃圾收集器需要解决的三个问题: 1)哪些内存需要回收 2)什么时候回收 3)如何回收 背景:程序计数器,虚拟机栈,本地方法栈3个区域随线程而生,随线程而灭,在这几个区域内不需要过多的考虑回收的问题,因 ...

  4. Linux内存管理之mmap详解

    转发之:http://blog.chinaunix.net/uid-26669729-id-3077015.html Linux内存管理之mmap详解 一. mmap系统调用 1. mmap系统调用  ...

  5. IntelliJ IDEA 破解方法

    2017版破解方法: 1. 到网站http://idea.lanyus.com/,按要求修改电脑HOST,获取注册码: 使用前请将“0.0.0.0 account.jetbrains.com”添加到h ...

  6. linux驱动之中断处理过程汇编部分

    linux系统下驱动中,中断异常的处理过程,与裸机开发中断处理过程非常类似.通过简单的回顾裸机开发中断处理部分,来参考学习linux系统下中断处理流程. 一.ARM裸机开发中断处理过程 以S3C244 ...

  7. console 命令进行 JS 调试的灵活用法

    1.console.log() 占位符 console.log 支持的占位符包括:字符(%s).整数(%d或%i).浮点数(%f)和对象(%o): console.log('字符串: %s, 整数: ...

  8. [WPF]何如在Win7使用Aero2主题

    1. 问题 假设我在Windows10的环境新建一个4.6的WPF项目,添加一个ComboBox,并用Blend在这个ComboBox上右键"编辑模板"->"编辑副 ...

  9. Python学习第十二篇——切片的使用

    Python中使用函数切片可以创建副本,保留原本.现在给出如下代码 magicians_list = ['mole','jack','lucy'] new_lists = [] def make_gr ...

  10. Linux下安装redis的详细过程(redis版本为4.0.10)

    1.安装redis步骤 1.推荐进入到linux路径/usr/local/src 2.$ wget http://download.redis.io/releases/redis-4.0.10.tar ...