extjs中grid中嵌入动态combobox的应用
程序员文章站
2022-06-24 18:35:13
拿combobox的数据 复制代码 代码如下: combods = new ext.data.jsonstore({ url : 'test.do', fields : [...
拿combobox的数据
combods = new ext.data.jsonstore({
url : 'test.do',
fields : [{
name : 'id'
}, {
name : 'display'
}]
});
combobox定义
combobox 中的id必须要有,后面要跟据id取combobox值。
var combobox = new ext.form.combobox({
id : "cb", //必须有
typeahead : true,
readonly : true,
allowblank : false,
autoscroll : true,
selectonfocus : true,
emptytext : '请选择...',
store : combods,
forceselection : true,
triggeraction : 'all',
displayfield : 'display',
valuefield : 'id'
});
grid 的定义:
ds = new ext.data.store({
baseparams : {
start : 0,
limit : rowcount
},
proxy : new ext.data.httpproxy({
url :'test2.do'
}),
reader : new ext.data.jsonreader({
root : 'data',
totalproperty : 'totalcount'
}, [{
name : "bh"
}, {
name : "test"
}]);
});
var cm = new ext.grid.columnmodel([new ext.grid.rownumberer(), {
header : "编号",
dataindex : "bh"
}, {
header : "测试",
dataindex : "test",
renderer : renderer,
editor : combobox
}]);
grid = new ext.grid.editorgridpanel({
title : '测试',
ds : ds,
cm : cm,
clickstoedit : 1,
viewconfig : {
forcefit : true
},
bbar : new ext.pagingtoolbar({
pagesize : rowcount,
store : ds,
displayinfo : true,
displaymsg : '显示第 {0} 条到 {1} 条记录,一共 {2} 条',
emptymsg : "没有记录"
})
});
cm 的renderer函数
此方法为解决combobox修改后显示为id
function renderer(value, p, r) {
var index = combods.find(ext.getcmp('cb').valuefield, value);
var record = combods.getat(index);
var displaytext = "";
if (record == null) {
displaytext = value;
} else {
displaytext = record.data.display;// 获取record中的数据集中的display字段的值
}
复制代码 代码如下:
combods = new ext.data.jsonstore({
url : 'test.do',
fields : [{
name : 'id'
}, {
name : 'display'
}]
});
combobox定义
combobox 中的id必须要有,后面要跟据id取combobox值。
复制代码 代码如下:
var combobox = new ext.form.combobox({
id : "cb", //必须有
typeahead : true,
readonly : true,
allowblank : false,
autoscroll : true,
selectonfocus : true,
emptytext : '请选择...',
store : combods,
forceselection : true,
triggeraction : 'all',
displayfield : 'display',
valuefield : 'id'
});
grid 的定义:
复制代码 代码如下:
ds = new ext.data.store({
baseparams : {
start : 0,
limit : rowcount
},
proxy : new ext.data.httpproxy({
url :'test2.do'
}),
reader : new ext.data.jsonreader({
root : 'data',
totalproperty : 'totalcount'
}, [{
name : "bh"
}, {
name : "test"
}]);
});
var cm = new ext.grid.columnmodel([new ext.grid.rownumberer(), {
header : "编号",
dataindex : "bh"
}, {
header : "测试",
dataindex : "test",
renderer : renderer,
editor : combobox
}]);
grid = new ext.grid.editorgridpanel({
title : '测试',
ds : ds,
cm : cm,
clickstoedit : 1,
viewconfig : {
forcefit : true
},
bbar : new ext.pagingtoolbar({
pagesize : rowcount,
store : ds,
displayinfo : true,
displaymsg : '显示第 {0} 条到 {1} 条记录,一共 {2} 条',
emptymsg : "没有记录"
})
});
cm 的renderer函数
此方法为解决combobox修改后显示为id
复制代码 代码如下:
function renderer(value, p, r) {
var index = combods.find(ext.getcmp('cb').valuefield, value);
var record = combods.getat(index);
var displaytext = "";
if (record == null) {
displaytext = value;
} else {
displaytext = record.data.display;// 获取record中的数据集中的display字段的值
}
上一篇: SpringBoot整合JWT的实现示例
下一篇: Nginx配置https的实现
推荐阅读
-
基于Protobuf动态解析在Java中的应用 包含例子程序
-
使用JAVA中的动态代理实现数据库连接池 JavaSQLJDBC应用服务器互联网
-
反射机制在动态生成类并访问该类数据中的应用
-
反射机制在动态生成类并访问该类数据中的应用
-
在 Soui 中嵌入 MiniBlink 初体验(三):实现一个界面友好动态可交互的饼图
-
基于Protobuf动态解析在Java中的应用 包含例子程序
-
extjs中grid中嵌入动态combobox的应用
-
Extjs EditorGridPanel中ComboBox列的显示问题
-
ExtJS4给Combobox设置列表中的默认值示例
-
Extjs4中的分页应用结合前后台