editorgrid panel 中combo值显示
当您Editor Grid Panel 中给某一列指定editor为combo box时，, 您要显示combo的display field的值而不是combo 的value值。 您可能需要使用一个combo value为 1,2,3 ，而它依次代替红色、 绿色和蓝色的三颜色。
最好的方式是去覆写Ext.grid.GridView 的 doRender 方法 在doRender(args) 参数中添加其它你需要的参数,
如下为作者覆写的 doRender 方法
Ext.override(Ext.grid.GridView, {
doRender : function(cs, rs, ds, startRow, colCount, stripe){
var ts = this.templates, ct = ts.cell, rt = ts.row, last = colCount-1;
var tstyle = 'width:'+this.getTotalWidth()+';';
var buf = [], cb, c, p = {}, rp = {tstyle: tstyle}, r;
for(var j = 0, len = rs.length; j < len; j++){
r = rs[j]; cb = [];
var rowIndex = (j+startRow);
for(var i = 0; i < colCount; i++){
c = cs[i];
p.id = c.id;
p.css = i == 0 ? 'x-grid3-cell-first ' : (i == last ? 'x-grid3-cell-last ' : '');
p.attr = p.cellAttr = "";
p.value = c.renderer(r.data[c.name], p, r, rowIndex, i, ds, this.grid);
p.style = c.style;
if(p.value == undefined || p.value === "") p.value = " ";
if(r.dirty && typeof r.modified[c.name] !== 'undefined'){
p.css += ' x-grid3-dirty-cell';
}
cb[cb.length] = ct.apply(p);
}
var alt = [];
if(stripe && ((rowIndex+1) % 2 == 0)){
alt[0] = "x-grid3-row-alt";
}
if(r.dirty){
alt[1] = " x-grid3-dirty-row";
}
rp.cols = colCount;
if(this.getRowClass){
alt[2] = this.getRowClass(r, rowIndex, rp, ds);
}
rp.alt = alt.join(" ");
rp.cells = cb.join("");
buf[buf.length] = rt.apply(rp);
}
return buf.join("");
}
});
其处理的关键点在
p.value = c.renderer(r.data[c.name], p, r, rowIndex, i, ds, this.grid); 在此处添加更多的参数
接下来你就可以自己定义你的renderer了。
someRenderer = function(v,md,r,ri,ci,s,g){
var f = g.getColumnModel().getCellEditor(ci,ri).field;
var s = f.store;
record = s.getById(v);
if (typeof record != 'undefined') {
return record.data[f.displayField];
} else {
return v;
}
};
如果你的combo 使用remote load数据, (ie triggerAction: 'query', mode: 'remote')
当combo里选择过时，它的下拉列表被过滤了，而不能显示出值来。
如果这样，你可以重新在 var s =f.store 此行时定义一个新的store来作筛选用。
end translate－－－－－－
其实我们通常用的combo很少会用到triggerAction:'query'的方式。
使用 triggerAction:'all' 方式就可避免点了下拉时看不到数据的情况。