现在用extjs做开发,tabpanel中使用的是iframe,但是现在有一个需求,就是点击这个panel中的一个按钮之后tabpanel新增一个panel页,但是用getCmp方法无法获取到tabpanel对象,报错找不到对象或未定义,我想问一下是不是使用了iframe之后就无法在子Panel中获取到tabpanel对象了?

解决方案 »

  1.   


    不知道你为什么不能getCMP获取
    但是有个技巧是
    ver mytab=new 你的tabpanel你的panel中的按钮的操作事件 直接操作 mytab就可以了
      

  2.   

    tabpanel中包含panel啊,怎么直接操作啊
      

  3.   

    闭包么
    比如这样一个方法返回一个 tab
    function mytab(){
      var tab=new ext.tabpanel({    //这里初始化tab 
          
          ....
          ,item:[new ext.panel({   //tab的items中初始化一个panel 没问题吧
                ,tbar:[            //初始化的panel添加一个工具栏
                   {text:'按钮'    //工具栏中增加一个按钮
                   ,handler:function{alert(tab.id);}   //按钮的事件中操作tab 没问题吧
                   }
                 ]
          )]
      });
      
      return tab;
    }这样的话不就可以了
      

  4.   

    当然如果你的pnel和tab不是一个运行层次中建立的 那么就这样
    function mypanel(tab){
       var p=new ext.panel({
        ...
        ,tbar:[{text:'button',function(){alert(tab.id);}}]
      });
    }
    function mytab(){
      var tab=new ext.tabpanel({
        ...
        ,items:[mypanel(tab);]   //吧tab传给panel的建立层次
      });
    }
    这样还是闭包 传参加闭包 更灵活解耦
      

  5.   

    我要传的是整个tabpanel对象怎么做?现在的需求是查看机柜信息中统计了服务器的数量,点击服务器的数量之后直接新开一个panel转到服务器列表去
      

  6.   

    我的页面是放在iframe里的,你是把tabpanel传给了panel,那Panel里面的iframe里的页面首先要获得panel吧?下面是我的源代码var left = new Ext.tree.TreePanel({
    title : '菜单列表',
    region : 'west',
    width : 200,
    border: false,
    autoScroll : true,
    collapsible:true,
    split : true,
    listeners : {
    click : function(n) {
    var url = n.attributes.url;
    var id = n.attributes.id;
    var p = center.getItem(id);
    if (url) {
    if (p) {
    center.setActiveTab(p);
    } else {
    p = new Ext.Panel( {
    title : n.attributes.text,
    closable : true,
    autoScroll : true,
    layout:'fit',
    id : id,
    items : [{
    html : "<iframe id=\"ifmain\" width=\"100%\" height=\"100%\" scrolling=\"auto\" frameborder=\"0\" src=\""+url+"\" ></iframe>"
    }]
    });
    center.add(p);
    center.setActiveTab(p);
    }
    }
    }
    }
    });
      

  7.   

    哦 iframe里面放panel
    iframe可以访问父窗体的js和对象 所以可以操作父窗口的tab另外你的 这个代码模块的结构有问题treepanel包含panel包含iframe包含panel  这样有意思吗 你这个iframe在整个嵌套层次里面存在的意义是什么? 整个代码的流畅性和ext的模块的完整性全破坏了,相互交互的东西放在一个层次里面比较好
    如果你的ifranm有必须显示的其他的格式化的信息
    那么你可以改成 tree{panel{iframe,panel}吧iframe里面的panel抽出来
      

  8.   

    什么iframe里面放panel啊,我是panel里面放iframe,iframe里面放页面啊!
    iframe里面的url是树节点所指向的页面路径
      

  9.   

    treepanel里面也没包含panel啊,center.add(p);包含panel的是对象center,一个tabpanelvar center = new Ext.TabPanel( {
    region : 'center',
    id : 'mainTabPanel',
    items:[{
    id:'opt1',
    title : '欢迎使用',
    layout:'fit',
    html : '欢迎使用此管理系统'
    }],
    enableTabScroll : true,
    autoScroll : true
    });
      

  10.   

    先建立一个空的panel 里面不要放iframe
    看看代码成立吗或者 你就说你8楼的代码错在哪里吧 那一步执行不下去
      

  11.   

    而且 你贴的代码里哪里有 getCmp调用了
      

  12.   

    调用getCmp是iframe里面的页面调用的好不,页面显示机柜的信息,其中有一项是统计的服务器的数量,点击服务器数量让tabpanel新增一个panel,简单点说,就是让一个子窗口对他的父窗口的父窗口进行操作。
    panel里面不放iframe直接放页面当然可行,但是,iframe是必须用的!否则所有的页面全都是在主页面一个页面中显示!你想想所有的数据全在一个页面上显示有啥后果!
    弱弱的问一句,你用过extjs开发过么- -!
      

  13.   

    不才玩过几个月 
    开发过动态模块加载框架(写着玩的) 
    类库反射生成ext界面化API调试器 (写着玩的)
    会员中心后台管理 
    游戏后台管理
    公司业务管理

    这个东西只是 省却了和美工沟通,建立UI模块的时间 用不用就这么点区别
    呵呵 大声的反问你句 你理解js 和ext吗
    好了上面是玩笑话 大家打住结构模式就不讨论了 写js是不能急的 
    先吧你的问题理清楚 说清楚了 才能解决
    我总结你的意思就是 页面中 左面一个iframe里面有个treepanel 右面一个tabpanel
    这个iframe中要获取 父窗口中的tabpanel 是不是这个意思
      

  14.   

    是,准确的说是获取父窗口panel的父窗口tabpanel
      

  15.   

    我有事要出去了 不过我写了段代码你看是不是这样
    主页面
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head>
        <title></title>
           <link rel="stylesheet" type="text/css" href="/r/ext/extjs/css/ext-all.css" />
        <!-- GC -->
      <!-- LIBS -->
      <script type="text/javascript" src="/r/ext/extjs/ext-base.js"></script>
      <!-- ENDLIBS -->    <script type="text/javascript" src="/r/ext/extjs/ext-all.js"></script>
        
        <script type="text/javascript">
            Ext.onReady(function() {
            //Ext.Msg.alert('kk');
            var tab=window.ptab = new Ext.TabPanel({
                renderTo: 'mytab',
                width: 450,
                activeTab: 0,
                frame: true,
                defaults: { autoHeight: true },
                items: [
                { title: 'test',html:'test' }
                
            ]
            });
            });
        </script>
      
    </head>
    <body>
    <div>
    <iframe src="inner.htm" ></iframe>
    </div>
    <div id='mytab'>
    </div>
    </body>
    </html>子页面
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head>
        <title></title>
           <link rel="stylesheet" type="text/css" href="/r/ext/extjs/css/ext-all.css" />
        <!-- GC -->
      <!-- LIBS -->
      <script type="text/javascript" src="/r/ext/extjs/ext-base.js"></script>
      <!-- ENDLIBS -->    <script type="text/javascript" src="/r/ext/extjs/ext-all.js"></script>
        
        <script type="text/javascript">
            Ext.onReady(function() {
            //Ext.Msg.alert('kk');
            var tab=window.ptab = new Ext.TabPanel({
                renderTo: 'mytab',
                width: 450,
                activeTab: 0,
                frame: true,
                defaults: { autoHeight: true },
                items: [
                { title: 'test',html:'test' }
                
            ]
            });
            });
        </script>
      
    </head>
    <body>
    <div>
    <iframe src="inner.htm" ></iframe>
    </div>
    <div id='mytab'>
    </div>
    </body>
    </html>你看下吧 不行留言我
      

  16.   

    子页面发错了<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head>
        <title></title>
        <script type="text/javascript">
            function getptab() {
                //alert(parent.window.ptab);
                var ptab = parent.window.ptab;
                var p = new parent.window.Ext.Panel({
                    title: 'iframe',
                    closable: true,
                    autoScroll: true
                });
                ptab.add(p);
                ptab.setActiveTab(p);
                
            }
        </script>
    </head>
    <body >
    <input type="button" onclick="getptab();" value='在父的tab中添加' /></body>
    </html>
      

  17.   

    行了,不过改了一下var ptab=parent.parent.window.ptab;
     var p = new parent.window.Ext.Panel({
                title: 'iframe',
                closable: true,
                autoScroll: true,
                items : [{
    html : "<iframe id=\"ifmain\" width=\"100%\" height=\"100%\" scrolling=\"auto\" frameborder=\"0\" src=\"machineRoom/machineRoom.html\" ></iframe>"
    }]
            });
            ptab.add(p);
            ptab.setActiveTab(p);
      

  18.   

    items = [{
    id : 'proposePanel',
    title : '建议信息',
    autoScroll : true,
    html:'<iframe id="searchWinFrame" src="'
    + url
    + '" width="100%" height="100%" frameborder="0" scrolling="auto"></iframe>'
    }