声明:此bug针对ext.3.3.0版本,其他版本是否有此bug不清楚。
1,找到文件ext-3.3.0\examples\ux\RowEditor.js
2,定位到上述文件中的函数verifyLayout 和函数resizeColumn
3,贴出上述两函数的代码(修改过的,带注释):
verifyLayout: function(force) {
if (this.el && (this.isVisible() || force === true)) {
var row = this.grid.getView().getRow(this.rowIndex); //获得行
this.setSize(Ext.fly(row).getWidth(), Ext.isIE ? Ext.fly(row).getHeight() + 9 : undefined); //设置roweditor宽高
var cm = this.grid.colModel,
fields = this.items.items;
for (var i = 0, len = cm.getColumnCount(); i < len; i++) {
if (!cm.isHidden(i)) {//调整非隐藏列
var adjust = 0;
if (i === (len - 1)) {//最后一列
adjust += 3; // outer padding
} else {
adjust += 1;
}
fields[i].show();
// zxp fixed the bug 0004299 2011-08-30 begin
aw = cm.getColumnWidth(i) - adjust;
fields[i].setWidth(aw); //当一个组件渲染后,这个函数改变的是封装此组件的el的style属性width,并不修改组件的width属性
fields[i].width = aw;//解决roweditor拖动列时错位的BUG
//zxp fixed the bug 0004299 2011-08-30 end
} else {
fields[i].hide();
}
}
this.doLayout();//布局的时候,计算的是组件的width属性,比如组件com,计算com.width;所以在未修改此bug时,执行完此函数后,位置没变;修改bug后,执行此函数位置跟着变动。注:doLayout函数的功能说粗点就是布局,说细点他完成大小、位置的调整。
// zxp fixed the bug 0004299 2011-08-30 begin
//this.resizeColumn();//解决roweditor拖动列时错位的BUG //看了doLayout函数后的行注释,就知道这里为什么要注释掉resizeColumn函数了
//zxp fixed the bug 0004299 2011-08-30 end
this.positionButtons();
}
}
/**
* 调整列的位置
*/
resizeColumn: function() {
var cm = this.grid.colModel,
fields = this.items.items;
if (this.elements && this.isVisible() && this.editing) {
for (var j = 0, len = cm.getColumnCount(); j < len; j++) {
if (j != 0) {
var position = fields[j - 1].getPosition();
var width = fields[j - 1].getWidth();//返回的是封装此组件的el的style属性width
fields[j].setPagePosition(position[0] + width, position[1]);
}
}
this.doLayout();//调整大小/位置后必须重新布局
}
}