请问Ext的Ext.TabPanel支持iframe吗

  我原来使用 dhtmlxTabbar，这个控件对Tab页的支持真是一流的棒，几乎所有的需要都可以得到满足，比较你可以让一个Tab页对应一个iframe，这样Tab页中内容的提交就可以不影响其它Tab页了。
  下面是dhtmlxTabbar控制使用 iframe模式的代码：
        

         //创建一个tabbar
         tabbar=new dhtmlXTabBar("content","top");
        tabbar.setImagePath("/imgs/");
        tabbar.setStyle("modern");
        tabbar.setHrefMode("iframes");//每一个Tab页对应一个新的iframe

        //添加一个Tab页
         vat tabId = "1",tabName="tab1";
        tabbar.addTab(tabId,tabName,"100px",0);
        _targetUrl = "http://www.baobaotao.com";
        tabbar.setContentHref(tabId,_targetUrl);

   我试了Ext的Tab控件，目前我还没有发现可以一个Tab页对应一个iframe的，不知道是否可以支持一个
Tab页一个iframe。请有知道的朋友赐教，谢谢。

评论

4 楼 xugq035 2007-08-12  

tab还是用ajax好点

3 楼 sp42 2007-08-12  

不是Ext.TabPanel
而是Ext.TabPanelItem

setUrl

引用

public function setUrl( String/Function url, [String/Object params], [Boolean loadOnce] )
Set a URL to be used to load the content for this TabPanelItem.

2 楼 stamen 2007-08-12  

   TabContent也可以用iframe了，呵呵，是这样的：
 

var tabs = new Ext.TabPanel('content');  
  var tabFrame =  Ext.DomHelper.append(document.body,
               {tag: 'iframe',id:'frame1',
                frameBorder: 0,scrolling:'no', 
                src: targetUrl,name:'Frame_2',
                style:'width:600px,height:400px'}); 
   var tab = tabs.addTab('frame1','标签名','',true);

  不过我觉得非常慢，我还是决定使用dhtmlxTabbar。

1 楼 stamen 2007-08-11  

  我现在使用BorderLayout和BasicLayoutRegion以及ContentPanel共同完成了支持iframe Tab页，
没有使用Tab控件。我们知道EXT的Layout的每一个区都可以放置多个ContentPanel，当放置多个ContentPanel，相应的区域会自动出现Tab页。只要在ContentPanel中放置一个iframe就可以了。我写了一个方法用于向center域添加Tab页，每个Tab页对应一个iframe:

        var openedTabMap = new col.JSMap();
        function openUrlInTabbar(tabId,tabName,targetUrl){
             var region = layout.getRegion('center',contentPanel);
             if(!openedTabMap.containsKey(tabId)){
                 var tabFrame = Ext.DomHelper.append( document.body,{tag: 'iframe',  frameBorder: 0, src: targetUrl,name:'Frame_'+tabId,style:'width:100%,height:100%'});
                 var contentPanel = new Ext.ContentPanel(tabFrame, {title:tabName,fitToFrame:true, closable: true});     
                 region.add(contentPanel);

                 openedTabMap.put(tabId,contentPanel);
             }else{
                 region.showPanel(openedTabMap.get(tabId));
             }
            
        }

    现在有一个问题是，这个Tab页标签出现在区域的底部，而不是顶部，不知道能否通过参数设置，改变Tab页标签的位置。有相关经验的朋友，请说出您的经验，谢谢。