用户登录
用户注册

分享至

extjs中grid中嵌入动态combobox的应用

  • 作者: 狗萌小主
  • 来源: 51数据库
  • 2021-08-05
拿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字段的值
}
软件
前端设计
程序设计
Java相关