xt中combobox在grid显示问题
问题描述:我在edit grid中嵌一个combox，combox的下拉单是文字的，但是提交时用数字代码表示。但是我的grid只显示数字代码，不显示对应的文字.
嘿嘿，这可问题对于我这样的初学者讲根本就不懂，呵呵，google了一下，找到解决办法，嘿嘿，不过我只是试验了一种成功，其它的要么就不成功，要么就看不懂，呵呵，我现在先把我做成功的代码贴出来（从网上找到，大家不要介意）:
第一种方案(我做成功了，嘿嘿)
首先,我的combobox是使用本地的字典表,即在namespace里定义的数据.数据结构为:
Ext.data.status = [
['1', 'Yes'],
['0', 'No']
]
我要实现的是在grid中显示字典表里对应的value,而不是code.需要有下面几个步骤:
1.定义ds,即引入字典表中的数据
var statusDS = new Ext.data.SimpleStore({ //通过字典表获得用户使用状态数据源
fields: ['code', 'value'],
data:Ext.data.status //这里对应我在字典表里定义的类型名称
});
2.在grid相应列中加入渲染,即修改ColumnModel某列属性,红色字体部分是核心代码
{
header: '<s:text name="com.label.username"/>',
dataIndex: 'userName',
width: 90,
align: 'center'
},{
header: '<s:text name="com.label.authority"/>',
dataIndex: 'userAuthority',
width: 60,
align: 'center',
editor: new Ext.form.ComboBox({
id:'statusCmb', //为combobox定义一个ID,必须的
hiddenName:'',
store: statusDS, //引入ds
displayField:'value', //值
valueField:'code', //代码
editable:false,
mode: 'local',
triggerAction: 'all'
}),
renderer: function(value, cellmeta, record) {
//通过匹配value取得ds索引
var index = statusDS.find(Ext.getCmp('statusCmb').valueField,value);
//通过索引取得记录ds中的记录集
var record = statusDS.getAt(index);
//返回记录集中的value字段的值
return record.data.value;//注意这个地方的value是上面displayField中的value,因为我水平低，搞了好长时间 才明白 ，呵呵
}
},{
header: '<s:text name="com.label.email"/>',
dataIndex: 'email',
width: 150,
align: 'center'
}
以上的代码只是根据我个人情况实现的,大家应用到自己程序时可能会有变动,还得随机应变啊
这是人家的后来我需要在grid中显示出上面的效果自写改了一下，把代码发上来：
//物料数据源
var materialDs = new Ext.data.JsonStore({
fields: ['matId','matName'],
url: '../combobox.do?action=getBaseMaterialComboBox',
autoLoad: true
})
//初始化物料名称Combobox
var materialCombo = new Ext.form.ComboBox({
name: 'matName',
fieldLabel: '物料名称',
store:materialDs,
valueField: 'matId',
displayField: 'matName',
typeAhead: true,
mode: 'local',//这个意思 我一直不明白，呵呵。
triggerAction: 'all',
emptyText: 'Select a inputNum name..',
selectOnFocus: true,
editable: false,
allowBlank: false
})
{header: '物料名称',dataIndex: 'matId',width: 170,sortable: true,renderer:function(value,cellmeta,record){
var index =materialDs.find(materialCombo.valueField,value);
var record = materialDs.getAt(index);
return record.data.matName;
}},
这种方式我不知道好不好，但我没办法，只能这样用，因为我只能想到这种方法。有更好的方法大家可以告诉我，谢谢。
第二种方案（这种方案比较简单，学习一下，呵呵）:
来源:http://www.iteye.com/topic/157067
{header:'单位',dataIndex:'Unit',sortable:true,width: 80,renderer:function(value){return value==1?'西药':'重要';},
editor: new Ext.form.ComboBox({
displayField:'kind',emptyText:'请选择',
valueField:'abbr',
selectOnFocus:true,
triggerAction: 'all',
mode: 'local',
store: new Ext.data.SimpleStore({
fields: ['abbr', 'kind'],
data:[[1,'西药'],[2,'中药']]
}),
lazyRender:true
})},
第三种方式(是我从一个论坛上找的一个留言,我没试验，不知道能否成功，呵呵):
renderer:function(value){ return t_value[value];//值对应的显示值数组},
listeners:{select:function(combo, record,index){ //回显值数组
t_value[record.data.t_valueId] = record.data.t_valueName; } },
第四种方式 （也是我从上面的论坛中找的，这个很乱,我把上面一个大侠的留言给贴上吧，呵呵）:
1、呵呵，这个问题其实很好办的哈。因为你要手动设置combox的值，给你看一个例子：
writePanel.fp.form.load({
waitMsg:"$!{lang.get('Loading')}",
url:this.baseUrl+"?cmd=read&id="+id,
success:function(form){
if(record.data.myCategory){
writePanel.fp.form.findField("myCategory").setValue(record.data.myCategory.id);
writePanel.fp.form.findField("myCategory").el.dom.value=record.data.myCategory.name;//text
var oEditor = FCKeditorAPI.GetInstance('content') ;
if(oEditor)oEditor.SetHTML(form.findField("content").getValue());
}
}
});
上面的程序是从后台加载表单数据到FormPanel中，由于combox的处理比较特殊，需要通过下面两句来给他手动赋值：
writePanel.fp.form.findField("myCategory").setValue(record.data.myCategory.id);
writePanel.fp.form.findField("myCategory").el.dom.value=record.data.myCategory.name;//text
2、我的意思是，你在修改的时候，得手动设置一下combox的值。
对于你的情况，由于返回的record.data.name = '2' ，那么你就要先在[[1,a],[2,b][3,c]]这个数组中查询，查询2这个值对应的显示文本，也就是查到B。然后你再调用下面的语句:
cmb.setValue(2);
cmb.el.dom.value=B;
这就就对了!
3、
{header:'用户名',dataIndex:'name',renderer:function(val){
//在这里return通过val(就是那个id)获取的name的值
return combostore.getAt(combostore.find('id',val)).data.name;
}}
4、
目前这个问题已经解决了
girdpanel.cm加上了一个
renderer: function(value, p, record) {
return value.name;
}
