iteye_17458 2009-09-06 09:20 采纳率: 0%
浏览 258
已采纳

用extjs 的editorgrid 表格自己乱动

刚接触ext ,我用了一个editorgrid,每次想要修改单元格中的数据时,表格就会乱跑,然后表格下面会出一个横向滚动条,改怎么解决,好像ff下没什么问题,ie7就会有这个问题
[b]问题补充:[/b]
[code="java"]{
header:'编号',
sortable:true,// 是否能排序
menuDisabled:false,// 是否允许菜单操作
width:40,
dataIndex:'id',
editor:new Ext.form.TextField({
maxLength:20
})
},{
header:'收支',
sortable:true,
menuDisabled:false,
width:40,
dataIndex:'title',
editor:new Ext.form.TextField({
maxLength:20
})
}, {[/code]
代码里我都加了width ,
如图所示: 这是点击以后的结果,我左边的一些就这样跑到里面去了
[img]http://dl.iteye.com/upload/attachment/143407/dac90cdd-0bcb-347a-8aad-fbb780c8221f.bmp[/img]
[b]问题补充:[/b]
而右边却空出一块空白的来
[b]问题补充:[/b]
可能刚才截的图不是太好,我加上allowBlank:false也不行,
在编辑前是这样的:
[img]http://dl.iteye.com/upload/attachment/143413/53180234-4993-31dc-8cba-07a515687c9e.jpg[/img]

当点击开始编辑时就成这样了:

[img]http://dl.iteye.com/upload/attachment/143415/0657bea1-dba1-3fdf-924b-46e7bed959a9.jpg[/img]

[b]问题补充:[/b]
是不是有个属性在ie中有问题,同样的代码在Firefox下没问题

[code="java"]

var user_in_out = new Ext.grid.ColumnModel([new Ext.grid.RowNumberer(),
{
header:'编号',
sortable:true,// 是否能排序
menuDisabled:false,// 是否允许菜单操作
width:40,
dataIndex:'id',
editor:new Ext.form.TextField({
maxLength:20,
allowBlank:false
})
},{
header:'收支',
sortable:true,
menuDisabled:false,
width:40,
dataIndex:'income',
renderer : income,
editor:new Ext.form.TextField({
allowBlank:false,
maxLength:20
})
}, {
header:'金额',
sortable:true,
menuDisabled:false,
width:40,
dataIndex:'money',
renderer : money,
editor:new Ext.form.TextField({
allowBlank:false,
maxLength:20
})
}, {
header:'操作人',
id:'user',
sortable:true,
dataIndex:'user',
width:40,
menuDisabled:false,
editor:new Ext.form.TextField({
allowBlank:false,
maxLength : 100
})
},{
header:'备注',
id : 'remark',
width:60,
menuDisabled:true,
dataIndex:'remark',
editor:new Ext.form.TextField({
allowBlank:false,
maxLength:20
})

    },{
        header:'日期',
        sortable:true,
        id : 'date',
        width : 40,
        renderer :  Ext.util.Format.dateRenderer('d/m/Y'),//格式化日期格式
        dataIdex:'date',
        menuDisabled:true
    }]);

// 设置money格式
function money(val){
return ''+val+'元' ;
};
// 设置收支格式
function income(val){
return ''+val+'';
}

user_in_out.defaultSortable = false;
var ds_duty = new Ext.data.Store({
proxy : new Ext.data.HttpProxy({//在同一个域中,使用httpproxy
url : 'duty.php'
}),
// proxy : new Ext.data.MemoryProxy(data),
reader : new Ext.data.JsonReader({//读取json数据格式
root : 'topics',//数据节点
totalProperty: 'totalCount'//总的记录数
}, [{

},{
    name:'id',
    type:'int'
}, {
    name:'income',
    type:'string'
}, {
    name:'money',

    type:'string'
},{
    name:'user',
    type:'string'
},{
    name:'remark',
    type:'string'
},{
    name:'date',
    type:'date'
}])

});
//添加相应按钮
var item_add = new Ext.Button({
text : ' 添加条目',
iconCls : 'add',
style : 'margin-left:20px',
handler : function(){
}
});
var item_del = new Ext.Button({
text : ' 删除条目',
iconCls : 'del',
handler : function (){
}

});
var item_show = new Ext.Button({
text : '&nbsp显示条目',
handler : function (){
}

});
// 添加Search

var item_ser = new Ext.ux.form.SearchField({
ds : ds_duty,
width : 236

});

var grid_duty = new Ext.grid.EditorGridPanel({
title : '收支管理',
// iconCls : 'icon-grid',
loadMask : {
msg : '数据加载中...'
},
region : 'center',
autoWidth : true,
height : 300,
cm : user_in_out,
ds : ds_duty,
sm : new Ext.grid.RowSelectionModel({
singleSelect : true
}),
enableColumnMove : false,
trackMouseOver : false,
frame : true,
autoExpandColumn : 'date',//该条目将沾满省余的空间
clicksToEdit : 1,
viewConfig: {
forceFit:true,
enableRowBody:true,
showPreview:true
},
collapsible: false,
animCollapse: false,

tbar : [item_add,'-',item_del,'-',item_show,'-',item_ser,'查询'],
bbar : new Ext.PagingToolbar({
        pageSize: 5,
        store: ds_duty,
        displayInfo: true,
        displayMsg: '当前显示 {0} - {1} of {2}',
        emptyMsg: "No topics to display"


})

});
ds_duty.load({params:{start:0, limit:5}});// 将数据分页载入表格,
Ext.ns('app.grid');//设置命名空间
var p_duty = {
id : 'duty-panel',
border : false,
layout : 'border',
items : [grid_duty]
};[/code]
[b]问题补充:[/b]
谢谢大家的帮助,我把[color=darkred]// autoExpandColumn : 'date',[/color]和[color=darkred]forceFit:true,[/color]这两条注释掉以后就好了,这样的话就是表格会严格按照我cm里定义的width 来显示,虽然好了,但我还是不明白为什么会在IE下出现这样的问题
[b]问题补充:[/b]
因为外层的容器比较多,数据也是从服务器读取的,所以没有贴出来
[b]问题补充:[/b]
我把其中刚注释的任意一条打开都会出现刚开始的问题,但是用firefrox 就能正常显示,是不是这里面的属性,有的在ie下显示有问题呀
[b]问题补充:[/b]
按照你说的,我把上面的代码提取出来测试发现以下几个问题:
1、 [color=red] autoExpandColumn : 'date',和forceFit:true[/color]
二者择其一则在ie和ff下显示都没有问题
2、我又把它放到原来的容器里,如果不指定[color=red]forceFit:true[/color]
那么ff也会出问题,而ie是无论怎样都会出问题
3、我的上层容器的部分代码:
[code="java"]var view = new Ext.Viewport({// create the main frame
// 主界面
layout : 'border',
title : '理财系统 V1.0',
items : [{
region :'north',
title :'理财系统 V1.0',
height :0,
margins:'5 0 0 0'
},{
region : 'west',
split : true,//加入分割线
collapsible : true,//可以收起展开
layout : 'accordion',
title : '管理选项',
items : [managerTree],//装载其它的panel
width : 200,
bbar : [{text : '开始',
width : 50,

        style : 'margin-left:10px',
        iconCls : 'start',

        menu : {
             items : [{
                text : '注销',
                width : 30,
                iconCls : 'logout'
             },'-',{
                text : '关闭',
                iconCls : 'close',
                handler : function (){

// Ext.Msg.alert('afdafda');
}
}]
}
}]

    }, {
        id : 'center',
        region : 'center',
        border : true,
        layout : 'card',//采用card 布局方式,每次只显示一个页面
        activeItem : 0,
        items : [p_duty]
}]

});
    Ext.getCmp('center').layout.setActiveItem('duty-panel');

});[/code]

麻烦你看一下那个地方有问题,谢谢了
[b]问题补充:[/b]
非常感谢atian25架构师不辞厌倦的帮我解决这个问题,但是我的还是有问题,我用的3.0版本的,不过还是那个问题,我现在把那个项目大了一个包,希望能有空帮我看一下,直接运行manage.html,即可,谢谢

  • 写回答

10条回答 默认 最新

  • iteye_10013 2009-09-07 00:23
    关注

    刚测试了, 2.2不正常,2.3/3.0正常

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(9条)

报告相同问题?

悬赏问题

  • ¥15 MATLAB动图的问题
  • ¥15 求差集那个函数有问题,有无佬可以解决
  • ¥15 【提问】基于Invest的水源涵养
  • ¥20 微信网友居然可以通过vx号找到我绑的手机号
  • ¥15 寻一个支付宝扫码远程授权登录的软件助手app
  • ¥15 解riccati方程组
  • ¥15 display:none;样式在嵌套结构中的已设置了display样式的元素上不起作用?
  • ¥15 使用rabbitMQ 消息队列作为url源进行多线程爬取时,总有几个url没有处理的问题。
  • ¥15 Ubuntu在安装序列比对软件STAR时出现报错如何解决
  • ¥50 树莓派安卓APK系统签名