easyui datagrid 动态表头2

前端

function goqry() {
$("#form").form("submit", {
url: "CJCK_bjcjfx_yfsl.aspx?opt=qry",
onSubmit: function () {
if ($(this).form(‘validate‘)) {
$(‘#tt‘).datagrid("loading");
return true;
} else {
return false;
}
},
success: function (data) {
data = jQuery.parseJSON(data);
if (data.columns != undefined) {
if (data.columns.length == 4) {
if (data.total > 0) {
var frozenColumns = $(‘#tt‘).datagrid("options").frozenColumns;
for (var i = 0; i < frozenColumns[0].length; i++) {
frozenColumns[0][i].rowspan = 4;
}
}

} else if (data.columns.length == 3) {
if (data.total > 0) {
var frozenColumns = $(‘#tt‘).datagrid("options").frozenColumns;
for (var i = 0; i < frozenColumns[0].length; i++) {
frozenColumns[0][i].rowspan = 3;
}
}

}
if (data.columns != null) {
$(‘#tt‘).datagrid({
columns: data.columns,
data: data.rows
});
} else {
$(‘#tt‘).datagrid({
data: data.rows
});
}

} else {
$(‘#tt‘).datagrid({
data: data.rows,
columns:[[]]
});
}
$(‘#tt‘).datagrid("loaded");
}
});
}

后台代码

response.write(xx());

public string xx(){

EasyUIDatagrid data = new EasyUIDatagrid();
data.total = dt.Rows.Count;
data.rows = DataTableToobject(dt);
data.columns = head;
return ToJson(data);

}

public class EasyUIDatagrid
{
public int total;
public object[] rows;
public object[] footer;
public string topmsg;
public EasyUIDatagridHead[][] columns;
public EasyUIMergeCells[] mergeCells;
}

时间: 2024-10-17 11:53:27

easyui datagrid 动态表头2的相关文章

转载 -- jquery easyui datagrid 动态表头 + 嵌套对象属性展示

代码功能: 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(da

jquery easyui datagrid动态改变title的值

title:'<input type="text" id="txtTitle1" style="background:none;border:none;"/>', onLoadSuccess:function(data) { $("#txtTitle1").val("所有教师 人数:"+$("#IndeterminateMembers").datagrid("get

easyui datagrid 动态加入、移除editor

使用easyui 行编辑的时候完毕编辑的功能比較简单,可是假设要依据一个框的值动态改变别的值或者编辑的时候禁用某个框的时候就比較麻烦了. 比方像以下这样:加入行的时候每一个值都是手动输入,改动的时候第一个值不能改动.我们来看下怎么实现这种效果. easyui本身是不提供这么细节的功能的.须要我们自己拓展下: 在编辑的时候移除第一列的editor属性,加入的时候,加入第一列的属性. //扩展datagrid:动态加入删除editor $.extend($.fn.datagrid.methods,

JQuery EasyUI DataGrid动态合并单元格

/**        * EasyUI DataGrid根据字段动态合并单元格        * @param fldList 要合并table的id        * @param fldList 要合并的列,用逗号分隔(例如:"name,department,office");        */        function MergeCells(tableID, fldList) {            var Arr = fldList.split(",&quo

jQuery Easyui datagrid动态列绑定

前几天有人在使用jQuery EasyUI的datagrid时,遇到不会动态绑定列的情况,而网上给出的例子可能也是比较早的处理办法,竟然需要修改easyui源码,其实解决这问题的思路是很简单,我们只需修改要显示的列即可.那位朋友最后改为这种处理时,发现还是有问题,最终我发现她返回不是合法json,里边多个方括号,这里推荐大家使用本站的JSON在线校验格式化工具来验证返回json是否正确. 这里我们以上篇文章中类似的简单json来说明这个问题,比如后台要根据当前用户的权限返回不同的json: 分享

EasyUi datagrid 动态生成表头

从后台到显示 表头显示数据 /** * 服务器账单明细 * @author Administrator * */ public class ServerBillingDetailInfo implements Serializable{ /** * */ private static final long serialVersionUID = 6802412713642265144L; private Long id;//服务器账单id private String bussinessNum;/

easyui datagrid 多表头设置

最近在做二维报表,要求报表的表头自定义.在网上找了好久二维报表的插件,一直找不到合适的.后来就用easyui 中的datagrid替代了一下. 根据实际需求,统计的信息可能不是一个模块中的字段信息,所以需要把模块和模块下的字段都显示出来,这就用到了表格中的合并单元格,但是在datagrid中如何实现呢? 如下: $('#text').datagrid({ border : 2, nowrap : false, fit : true, url: '<%=request.getContextPath

easyui datagrid 动态添加columns属性

公司在项目设计的时候,有一个需求,就是查出来的表的字段不唯一,一张表的字段可能是三个,也可能是五个,但是却要把它显示到页面,这个给我做ui的带来一点麻烦.因为以前一般用easyui 的datagrid里的columns属性都是对应数据库表里的字段,现在字段都不知道,怎么用datagrid显示数据呢?本人在这里介绍最笨的办法,就是拼接出columns 属性的格式,我承认,我的办法效率不高,但是当你无从下手的时候,,这未尝不是解决问题的办法,当然在解决这个问题之前,我也百度了一下,试了一些办法,有的

EasyUI DataGrid 多级表头设置

使用EasyUI做一个报表统计,需要合并表头为多级表头,核心代码如下: $('#dg').datagrid({ url:'datagrid_data.action', fit : true, fitColumns : false, columns: [ [ {"title":"网格员考核测评表","colspan":9} ], [ {"field":"ORGNAME","title":&