tw198511
tw198511
2010-07-21 16:47

高级菜单重复出现

已采纳

请看图
每点击一次左边的树,刷新中间的iframe页面之后,先点击高级查询一次。
然后点击一次树 ,再点击一次高级查询,
然后点击一次树 ,再点击一次高级查询,
如此循环
菜单就成倍增加!
求高手解决啊。。
下面是我表格的代码
[code="java"]var grid = new Ext.grid.GridPanel({
renderTo: "test",
height:400,
title : '中国开源产品',
columns : [{
header : '编号',
dataIndex : 'id',
sortable : true,
renderer:function(value){return ""+value+""}
}, {
header : '名称',
dataIndex : 'uid',
sortable : true
}, {
header : '密码',
dataIndex : 'password',
sortable : true
}, {
header : '职业',
dataIndex : 'remark',
sortable : true
}, {

                        header : '性别',
                        dataIndex : 'sex',
                        sortable : true,
                        renderer : sexrender
                    }],

            store : store,
            loadMask : true,
            viewConfig : {
                forceFit : true
            },

            autoExpandColumn : 2,
            bbar : new Ext.PagingToolbar({
                        pageSize : 5,
                        displayInfo : true,
                        store : store,

                        plugins:[new Ext.ux.plugins.PageComboResizer()],
                        beforePageText : '第',
                        afterPageText : '页 共{0}页',
                        emptyMsg : "没有记录",
                        displayMsg : '显示第 {0} - {1} 条记录,共 {2}条记录'
                    }),
            tbar : [{
                        id : 'addButton',
                        text : '添加员工',
                        iconCls : 'addIconCss',
                        tooltip : '新增员工',
                        handler : onadd,
                        scope : this
                    }, '-', {
                        id : 'editButton',
                        text : '编辑信息',
                        iconCls : 'editIconCss',
                        tooltip : '编辑所选用户',
                        handler : onedit,
                        scope : this
                    }, '-', {
                        id : 'delButton',
                        text : '删除用户',
                        iconCls : 'deleteIconCss',
                        tooltip : '删除所选用户',
                        handler : ondel,
                        scope : this
                    }, '->', {
                        id : 'searchButton',
                        text : '高级查询',
                        iconCls : 'selectIconCss',
                        menu: new Ext.menu.Menu({
                                            id: 'mainMenu1',

                                            items: [{
                                                    text: '按费率名称查询',
                                                    iconCls: 'selectIconCss',
                                                    id: 'menu001'


                                                    },{
                                                    text: '按费率前缀查询',
                                                    iconCls: 'selectIconCss',
                                                    id: 'menu002'


                                                     }]
                                            })
                }]

        });[/code]

我刚刚发现这个页面单独出来就没问题,内嵌框架就有问题。
我内嵌的事件是这样写的
[code="java"] m1_1.on("click", function() {
Ext.getCmp("center").load({

url : "right.php",

discardUrl : false,

nocache : true,

          text : "Loading...",  
          timeout : 30,  
          scripts : true
      });  
  });[/code]
  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 复制链接分享
  • 邀请回答

1条回答

  • cyrilluce cyrilluce 11年前

    这个系统设计有很大问题,现在你使用的是Panel.load方法加载子页面,已经算是OPOA模式了;在这种模式下要考虑的事件很多。

    首先,切换页面后,原本页面的元素都没有销毁。
    非OPOA是不会有问题,因为页面关闭就自动释放了。现在你使用的是load方法加载,它是不会创建iframe的,而是直接引入html,所以子页面中的组件与主页面同属一个运行环境。这样导致你每次切换都有一大堆组件没有释放。
    普通的放于面板内的还好,组件没销毁但html销毁了,但弹出窗口、菜单这类关联的dom节点位于其它位置的组件,连html都不会销毁。

    其次,很多组件都使用到了ID,在OPOA内极有可能与其它页面产生冲突,因为它是唯一的,无法并存。

    这里出现重复的原因大致是这样:
    切换页面后,菜单(Menu)是位于Body下的,是不会被更新掉。
    而它又使用了ID,并会体现在html节点上。
    当你再次点击时,子页面内的组件又创建了一次,获取ID时拿到旧的html,在它的基础上又重新render了自己的dom节点,从而出现重复项

    最简单的解决办法是使用iframe,但会使与子页面交流不便
    或者全面向OPOA方向改进,抽象页面,增加清理方法,避免使用ID,等等

    点赞 评论 复制链接分享

相关推荐