从服务器端获取列和数据动态创建Ext.grid.EditorGridPanel
1、添加列的方法
var addColumn = function(){
this.fields = '';
this.columns = '';
this.addColumns=function(name,caption){
if(this.fields.length > 0){
this.fields += ',';
}
if(this.columns.length > 0){
this.columns += ',';
}
this.fields += '{name:"' + name + '"}';
this.columns += '{header:"' + caption + '",dataIndex:"' + name + '",sortable:true,hidden:true}'; };
15 };
2、从服务器端获取列,然后动态添加到ColumnModel中
Ext.Ajax.request({
url : '/action',
success:function(response,option){
if(response.responseText==""){
return;
}
data = new addColumn();
var res = Ext.util.JSON.decode(response.responseText);
for(var i=0;i<res.data.length;i++){
data.addColumns(res.data[i].id,res.data[i].name);
}
//动态生成GridPanel
makeGrid();
},
failure:function(){
Ext.Msg.alert("消息","查询出错----");
}
});
3、将列添加到grid中
//动态生成GridPanel
var makeGrid = function(){
var cms = new Ext.grid.ColumnModel(eval('([' + data.columns + '])'));
cms.defaultSortable = true;
var fields = eval('([' + data.fields + '])');
var store = new Ext.data.Store({
proxy:new Ext.data.HttpProxy({ url : '/action'}),
reader:new Ext.data.JsonReader({totalProperty:"total",root:"data",fields :fields })
});
store.load({params:{start:0,limit:50}});
var grid =new Ext.grid.EditorGridPanel({
id:'rigthBW',
viewConfig:{forceFit:true,autoScroll:true},
store:store,
bodyStyle:'width:100%',
cm:cms,
height:540,
autoWidth:true,
layout : 'fit',//自适应布局
border:"1",
renderTo:"showBW",
bbar:new Ext.PagingToolbar
({
emptyMsg:"没有数据",
displayInfo:true,
displayMsg:"显示从{0}条数据到{1}条数据,共{2}条数据",
store:store,
pageSize:50,
refreshText:"刷新列表"
})
});
grid.loadMask.msg='正在加载.........';
}
}
从服务器端获取列和数据动态创建Ext.grid.EditorGridPanel的更多相关文章
- 初探原生js根据json数据动态创建table
初探原生js根据json数据动态创建table 小生以实习生的职位进入了一家非纯软件的公司做asp.net开发,大半个月下来发现公司里居然没有前端工程师,这令我很诧异,跟着公司做项目,发现前端后台没有 ...
- 一起使用mock数据动态创建表格
在ant-design中,我们创建一个基础table会怎么实现呢? 如下代码可视,我们会自己创建一些数据,在表格中渲染出来,如下 <Card title="基础表格"> ...
- 程序间获取ALV显示数据(读取ALV GRID上的数据)
程序间获取ALV数据的两种方法: 方法1:通过修改SUBMIT的目标程序,把内表EXPORT到内存,SUBMIT后IMPORT ,该方法需要修改目标程序,可以任意设置目标程序的中断点: * Execu ...
- 小程序 picker 多列选择器 数据动态获取
需求是将各校区对应各班级的数据 以两列选择器的方式展示出来,并且可以在选择完成之后记录选结果参数. 校区数据 和 班级数据 分别是两个接口,以 校区 teach_area_id 字段关联 其各班级数据 ...
- mui 根据 json 数据动态创建列表
使用 underscore.js 模块解析 Underscore提供了一个轻量级的模板解析函数,它可以帮助我们有效地组织页面结构和逻辑. 实例: <!DOCTYPE html> <h ...
- layui 根据根据后台数据动态创建下拉框并同时默认选中
第一步 form表单里写好一个下拉框 <div class="layui-form-item"> <label class="layui-for ...
- 《项目经验》--后台一般处理程序向前台JS文件传递JSON,JS解析JSON,将数据显示在界面--显示在DropDownList 或 显示在动态创建的table中
http://blog.csdn.net/mazhaojuan/article/details/8599167 先看一下我要实现的功能界面: 这篇文章主要介绍:后台一般处理程序把从数据库查找的数据,转 ...
- JS,Jquery,ExtJs不同脚本动态创建DOM对象
好久不来写东西了,这段时间太慢了,闲了下来看了几篇文章,觉得很好,同时也许咱们大家都能遇到,所以就把它记录下来... 简单使用JavaScript.JQuery.ExtJs进行DOM对象创建的测试,主 ...
- JS、JQuery和ExtJs动态创建DOM对象
做了个简单使用JavaScript.JQuery.ExtJs进行DOM对象创建的测试,主要是使用JavaScript.JQuery.ExtJs动态创建Table对象.动态Table数据填充.多选控制. ...
随机推荐
- maven单元测试设置代理
背景 环境需要设置代理才能够访问外部网络,如果只是运行java程序来访问网络,我们可以通过java -jar test.jar -DproxyHost=proxy_ip -DproxyPort=pro ...
- readelf相关命令
-a --all 显示全部信息,等价于 -h -l -S -s -r -d -V -A -I. -h --file-header 显示elf文件开始的文件头信息. -l --program-heade ...
- UE4 C++BeginPlay And BlueprintBeginPlay
今天遇到了一个诡异的问题,经过几个小时的煎熬终于找到了原因.mmmp 如果有一个类AActorChild,这个AActorChild继承自AActor,再有一个蓝图类BPAActorChild. 蓝图 ...
- Go的基本环境配置
参考 https://golang.org/doc/install?download=go1.7.1.linux-amd64.tar.gz https://github.com/qlshine/the ...
- 设计模式笔记——GoF设计模式汇总
目录 · 总述 · 记忆 · 效果 · 面向对象设计原则 · 创建型模式 · 单例模式(Singleton) · 效果 · 分类 · 代码(饿汉式) · 代码(懒汉式) · 代码(双重检测锁式) · ...
- Mysql MHA(GTID)配置(实操)
实现环境 centos6.7 MYSQL5.6.36 主:192.168.1.191 从1:192.168.1.145 从2:192.168.1.146 监测:放在从2上 192.168.1.146 ...
- 在App Store中无法更新xcode 8.3.2时 以及更新新系统10.12
今天更新Xcode 遇到三个坑坑1 要想更新Xcode最新版本 需要先把电脑系统更新到10.12 坑2 电脑系统更新到10.12 需要更新Mac Sierra 就可以了坑3 在App Store中下载 ...
- python进阶(6):多态,封装
昨天说了面向对象三大特性的继承,今天来说多态和封装,很多其他程序员说python不支持多态没有多态,并不是python没有多态,而是python处处皆多态.今天的讲课重点会放在封装. 一.多态 1.多 ...
- Shell curl 和 wget 使用代理IP
Linux Shell 提供两个非常实用的命令来爬取网页,它们分别是 curl 和 wget curl 和 wget 使用代理 curl 支持 http.https.socks4.socks5 wge ...
- mysql 报错 session halted的解决办法,实际工作中的结论。
写后台程序,发现执行到sql语句时就报错session halted,如下图: 也上网搜过蛮多方法,都不能解决我的问题.后来自己发现了症结所在,其实很简单:执行insert的语句没有包含not nul ...