easyui dataGrid 动态添加列

其实很简单.
新手创作,不好勿喷.
jsp页面:

 1 <script>
 2     $(function () {
 3
 4         $.getJSON(‘${pageContext.request.contextPath}/resources/json/datagrid_data.json‘,function(result){
 5             var columns=new Array();
 6             $.each(result.headers[0], function(i, field){
 7                 var column={};
 8                 column["title"]=i;
 9                 column["field"]=field;
10                 column["width"]=50;
11                 columns.push(column);//当需要formatter的时候自己添加就可以了,原理就是拼接字符串.
12             });
13             $(‘#tt‘).datagrid({
14                 title:‘ XXX公司价差补差分配表‘,
15                 height:500,
16                 singleSelect:true,
17                 url:‘‘,
18                 frozenColumns :[[
19                     {field:‘name‘,title:‘项目‘,width:80,sortable:true,align:‘center‘},
20                     {field:‘count‘,title:‘合计‘,width:150,sortable:true}
21                 ]],columns : [
22                     columns
23                 ],
24                 rownumbers:true}).datagrid(‘loadData‘,result.bodys);
25         });
26     })
27 </script>
28 <div title="XXX公司价差补差分配表" fit="true" border="false" style="height: 94%;">
29 <table id="tt"  ></table>
30 </div>

json 代码格式.我这不用分页 也就没有total

{"headers":[
    {"一月份":"Jan","二月份":"Feb"}
],"bodys":[
    {"name":"LNG","count":"50000","Jan":"20000","Feb":"30000"}
]
}

这样就行了 是不是很简单........

时间: 2024-11-10 15:27:30

easyui dataGrid 动态添加列的相关文章

EasyUI datagrid动态添加列

任务描述:根据用户选择时间段,生成列数据,如图 一.先定义好datagrid固定的数据列 <script type="text/javascript"> $(document).ready(function () { $("#td_Radio").datagrid({ striped: true, border: true, iconCls: 'icon-edit', //图标 singleSelect: true, autoRowHeight: tru

Wpf DataGrid动态添加列,行数据(二)

这是第二中方法,可直接绑定,我这里只是做出了一种思路,并不是最完美. 这里注意一下,因为我里面引用了MVVMLight,所以可能代码不是复制过去就能用了的. 样式也是,所以复制过去看不是我贴出来的界面这也不奇怪.代码: <Grid> <Grid.ColumnDefinitions> <ColumnDefinition Width="*"/> </Grid.ColumnDefinitions> <Grid.RowDefinitions

easyui datagrid 动态添加columns属性

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

EasyUI DataGrid动态修改列标题

var option = $('#tt').datagrid("getColumnOption", "列名") option.title = "新的列名"; $('#tt').datagrid(); 其实就是先获取到列的数据信息,修改,重置. 看下官方的说明,如下,

WPF datagrid 动态增加列

DataGrid动态增加列 <Window x:Class="WpfApplication1.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="MainWindow" Height="

jquery easyui datagrid动态改变title的值

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

WPF Datagrid 动态生成列 并绑定数据

原文:WPF Datagrid 动态生成列 并绑定数据 说的是这里 因为列头是动态加载的 (后台for循环 一会能看到代码) 数据来源于左侧列 左侧列数据源 当然num1 属于临时的dome使用  可以用ObservableCollection集合代表 动态创建属性 WPF 动态生成对象属性 (dynamic) ObservableCollection<NameList> listName = new ObservableCollection<NameList>(); privat

WPF DataGrid动态生成列的单元格背景色绑定

原文:WPF DataGrid动态生成列的单元格背景色绑定 <DataTrigger Binding="{Binding RelativeSource={RelativeSource Self}, Path=Column.DisplayIndex}" Value="1"> <Setter Property="Background" Value="{Binding RelativeSource={RelativeSour

jQuery Easyui datagrid动态列绑定

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