Easy UI combogrid动态加载数据
场景:
datagrid的每一行允许编辑,一行中有一个字段,编辑时,提供下拉框选项,供选择。
下拉框选项有多个列。如下图所示:(点击红框内的下拉按钮,会弹出绿框内的内容)

要求:
每行弹出的下拉框内容并不完全一致,需要根据某些变化的条件,随机获取。
代码:
path是datagrid的一个字段,这个字段在编辑时,需要以下拉选项的形式出现。
这里只展示一个字段的编辑选项,是如何配置combogrid动态加载下拉框选项值的。
{
// datagrid的其他字段...
},
{
field : 'path', // 实际属性
title : 'Path', // 页面显示的列名
editor : {
type:'combogrid', // 指定使用combogrid组件
options:{ // combogrid组件的属性设置
panelWidth : 450,
panelHeight : 250,
idField : 'id', // 选中下拉选项时,实际保存的值,来自columns
textField : 'path', // 选中下拉选项时,框中显示的值,来自columns
method : "GET", // ajax动态请求的方式
url : '/rest/test?id=' + $('#id_select').val(), // 在这里配置url,并不好用。url的值需要在每次请求前动态修改才可以。
mode : 'remote', // 指定是调用远程方法获取
fitColumns : true,
multiple: false,
editable: false, // 不可编辑
columns : [[
{
field : 'id',
title : 'id',
width : 50,
hidden : true
},
{
field : 'path',
title : 'Path',
width : 150
},
]],
onBeforeLoad : function(){
// 关键代码:在每次ajax请求前,修改url的值
$(this).datagrid('options').url = '/rest/test?id=' + $('#id_select').val();
},
loadFilter: function (respose){
// 关键代码:将返回的值,转为combogrid可识别的数据。
// combogrid只要两个字段:total,总数;rows,所有列的数据,是一个数组。
// response.data是一个对象list
respose.total = respose.data.length;
respose.rows = respose.data;
return respose;
},
}
},
},
{
// datagrid的其他字段...
}
Easy UI combogrid动态加载数据的更多相关文章
- AppCan学习笔记----关闭页面listview动态加载数据
AppCan页面关闭 AppCan 的页面是由两个HTML组成,如果要完全关闭的话需要在主HTML eg.index.html中关闭,关闭方法:appcan.window.close(-1); 管道 ...
- [JS前端开发] js/jquery控制页面动态加载数据 滑动滚动条自动加载事件
页面滚动动态加载数据,页面下拉自动加载内容 相信很多人都见过瀑布流图片布局,那些图片是动态加载出来的,效果很好,对服务器的压力相对来说也小了很多 有手机的相信都见过这样的效果:进入qq空间,向下拉动空 ...
- 微信小程序(五) 利用模板动态加载数据
利用模板动态加载数据,其实是对上一节静态数据替换成动态数据:
- mui 动态加载数据出现的问题处理 (silder轮播组件 indexedList索引列表 下拉刷新不能继续加载数据)
mui-slider 问题:动态给mui的图片轮播添加图片,轮播不滚动. 解决:最后把滚动轮播图片的mui(".mui-slider").slider({interval: 300 ...
- ASP.NET MVC动态加载数据
ASP.NET MVC动态加载数据,一般的做法是使用$.each方法来循环产生tabel: 你可以在html时先写下非动态的部分: Source Code 上图中,有一行代码: <tbody ...
- js实现滚动条来动态加载数据
主要angular2+es6 data:Array<any> //展示的数据 allData:Array<any> //全部的数据 size:number = 10 //每次动 ...
- js/jquery控制页面动态加载数据 滑动滚动条自动加载事件--转他人的
js/jquery控制页面动态加载数据 滑动滚动条自动加载事件--转他人的 相信很多人都见过瀑布流图片布局,那些图片是动态加载出来的,效果很好,对服务器的压力相对来说也小了很多 有手机的相信都见过这样 ...
- js动态加载数据并合并单元格
js动态加载数据合并单元格, 代码如下所示,可复制直接运行: <!DOCTYPE HTML> <html lang="en-US"> <head> ...
- 爬虫--selenuim和phantonJs处理网页动态加载数据的爬取
1.谷歌浏览器的使用 下载谷歌浏览器 安装谷歌访问助手 终于用上谷歌浏览器了.....激动 问题:处理页面动态加载数据的爬取 -1.selenium -2.phantomJs 1.selenium 二 ...
随机推荐
- redis配置(redis.conf)
1.如果我们刚刚装好 redis 发现Redis Desktop Manager无法连接到redis, 那是因为redis默认配置只让本机访问,我们 vim redis.conf 注释以下 ...
- Java WebSocket HttpSession与WebSocket Session的关联
当HttpSession中止(通过显示地失效或超时)时,Web容器会把HttpSession属性从HttpSession中清除. javax.servlet.http.HttpSessionBindi ...
- python编码转换
Pyton内部的字符串一般都是unicode编码或字节字符串编码:代码中字符串的默认编码与代码文件本身的编码是一致的:编码转换通常需要以unicode编码作为中间编码进行转换,即先将其他编码的字符串解 ...
- HTTP协议2
一.响应协议 格式: (1)响应首行:HTTP协议版本,不可默认 (2)响应头信息:可以默认 响应内容是由服务器发送给浏览器的内容,浏览器会根据响应内容来显示 (3)空行: (4)响应体: 响应内容是 ...
- angular学习笔记(1)- 四大核心特性
angular1学习笔记(1) - angular1四大核心特性 1.MVC model:数据模型层 controller:业务逻辑和控制逻辑 view:视图层,负责展示 2.模块化 Module ...
- PHP01
1.服务端开发基础 前端开发最终还是属于web端开发的一个分支,想要成为前端程序员,就要充分理解web的概念. 网站的概念: 可以在浏览器上通过一个地址直接访问使用 用于提供一种或多种特定服务的一系列 ...
- JAVA自学笔记21
JAVA自学笔记21 1.转换流 由于字节流操作中文不是非常方便,因此java提供了转换流 字符流=字节流+编码表 1)编码表 由字符及其对应的数值组成的一张表 图解: 2)String类的编码和解码 ...
- Python常用的软件包
下面是Python开发常用的软件包. 名称 用途 安装命令 opengl sudo pip3 install PyOpenGL pyqtgraph GUI图形库 sudo pip3 instal ...
- springboot RestTemplate httpclient
RestTemplate是spring支持的一个请求http rest服务的模板对象,性质上有点像jdbcTemplate RestTemplate底层还是使用的httpclient(org.apac ...
- Spark2.2(三十九):如何根据appName监控spark任务,当任务不存在则启动(任务存在当超过多久没有活动状态则kill,等待下次启动)
业务需求 实现一个根据spark任务的appName来监控任务是否存在,及任务是否卡死的监控. 1)给定一个appName,根据appName从yarn application -list中验证任务是 ...