EXTJS_Tabpanel布局,选项卡加载页面,调用别的jsp页面,截图所示

标签： extjsjspfunctionborderlayout 2011-07-21 14:01  2869人阅读  评论(1)  收藏  举报   分类： EXTJS（7） 

版权声明：本文为博主原创文章，未经博主允许不得转载。

先上来:advancedTree01.json文件的的内容

[

  {    "text":"卡卡西班",    "id":"01",    "allowDrag":false,    "des":"最强的组合！",     "children":[     {"text":"小樱","id":"0101","allowDrag":false,"des":"一个很可爱的女孩！","children":[             {"text":"小樱1","id":"010101","leaf":true,"allowDrag":true,"des":"一个很可爱的女孩！"},             {"text":"鸣人1","id":"010202","leaf":true,"allowDrag":true,"des":"四代火影的儿子！"},             {"text":"佐助1","id":"010303","leaf":true,"allowDrag":true,"des":"为了杀自己哥哥而活着的男人！"}              ]     },     {"text":"鸣人","id":"0102","leaf":true,"allowDrag":true,"des":"四代火影的儿子！"},     {"text":"佐助","id":"0103","leaf":true,"allowDrag":true,"des":"为了杀自己哥哥而活着的男人！"}    ]   },   {    "text":"凯班",    "id":"02",    "allowDrag":false,    "des":"有一个很白痴的老师！",    "children":[     {"text":"小李","id":"0201","leaf":true,"allowDrag":true,"des":"他的努力意识值得任何人学习！"},     {"text":"宁次","id":"0202","leaf":true,"allowDrag":true,"des":"白眼族的天才忍者！"},     {"text":"天天","id":"0203","leaf":true,"allowDrag":true,"des":"她救活了一个暗器公司！"}    ]   }

 ]

 Ext.onReady(function(){           var tree1 = new Ext.tree.TreePanel({                 id : 'tree-mianban',                 title : 'All publisher',                                frame : true,                  collapsible : true,                    height:1200,                     width : 400,                 split : true,                  minSize : 200,                  maxSize : 600,                  loader : new Ext.tree.TreeLoader({ dataUrl : 'common/myjs/advancedTree01.json' }) });              // 根节点              var root1 = new Ext.tree.AsyncTreeNode({                  text : '木叶',                 draggable : false,                 id : 'root1'//children : json                 });                  tree1.setRootNode(root1);                   root1.expand(true, true);                                  var form1 = new Ext.form.FormPanel({                      title : '广告管理',                     width : 400,                     collapsible : true,                      frame : true,                     labelWidth : 2,                     region : 'west',                     items : [                              { xtype : 'fieldset',                                   layout : 'column',                                   height : 50,                                   defaultType : 'radio',                                   items : [{ name : 'radio',                                      id : 'manradio',                                      boxLabel : 'standard',                                       hideLabel : true,                                       inputValue : 'man',                                      checked : true,                                      listeners : { 'check' : function(item,check) {                                           //监听check事件 你之前那么写是错的 Ext渲染完后 dom元素的id不再是manradio                                           alert(check);                                          alert(item.id)                                          } } },                                           { name : 'radio',                                              id : 'womanradio',                                              hideLabel : true,                                               boxLabel : 'virtualGroup',                                              inputValue : 'woman',                                               listeners : { 'check' : function(item,check) {                                                   alert(check);                                                  alert(item.id) } } }] },                                                   { xtype : 'textfield',                                                      anchor : '98%',                                                       value : '搜索',                                                      id : 'search',                                                       name : 'text'                                                          }, tree1] });                                                                         var form2 = new Ext.form.FormPanel({                      title : 'Media',                     region : 'north',                      frame : true,                      height :100,                     layout : 'column',                      border : true,                     anchor : '100%',                     labelWidth : 30,                     xtype : 'fieldset',                      items : [                              {                          columnWidth : .3,                         layout : 'form',                          border : false,                          items : [                                  { xtype : 'textfield', fieldLabel : 'time', name : 'aaa', anchor : '40%' }] },                     { columnWidth : .3, layout : 'form', border : false, items : [{ xtype : 'textfield', fieldLabel : 'area', name : 'bbb', anchor : '40%' }] },                     { columnWidth : .3, layout : 'form', border : false, items : [{ xtype : 'textfield', fieldLabel : 'category', name : 'bbb', anchor : '40%' }] }                     ] });                             var center = new Ext.TabPanel({              title:'center',              defaults:{autoScroll:true},              frame:true,              region:'center',                           items: [{                  id: 'Campaigins',                  title: 'Campaigins',                   html:' <iframe scrolling="auto" frameborder="0" width="100%" height="100%" src="'+'gridpanel.jsp'+'"> </iframe>',                  listeners:{                   // 添加监听器，点击此页面的tab时候要重新加载（刷新功能）                    activate:function(){                     this.getUpdater().refresh();                    }                    }              },              {                  id: 'Groups',                  title: 'Groups',                 html:' <iframe scrolling="auto" frameborder="0" width="100%" height="100%" src="'+'http://www.dangdang.com'+'"> </iframe>',                  listeners:{                   // 添加监听器，点击此页面的tab时候要重新加载（刷新功能）                    activate:function(){                     this.getUpdater().refresh();                    }                    }              },             {                  id: 'Ads',                  title: 'Ads',                 html:' <iframe scrolling="auto" frameborder="0" width="100%" height="100%" src="'+'http://www.baidu.com'+'"> </iframe>',                  listeners:{                   // 添加监听器，点击此页面的tab时候要重新加载（刷新功能）                    activate:function(){                     this.getUpdater().refresh();                    }                    }              },              {                  id: 'Keywords',                  title: 'Keywords',                  html:' <iframe scrolling="auto" frameborder="0" width="100%" height="100%" src="'+'http://www.google.com'+'"> </iframe>',                  listeners:{                   // 添加监听器，点击此页面的tab时候要重新加载（刷新功能）                    activate:function(){                     this.getUpdater().refresh();                    }                    }              },              {                  id: 'Placements',                  title: 'Placements',                  html:' <iframe scrolling="auto" frameborder="0" width="100%" height="100%" src="'+'gridpanel.jsp'+'"> </iframe>',                  listeners:{                   // 添加监听器，点击此页面的tab时候要重新加载（刷新功能）                    activate:function(){                     this.getUpdater().refresh();                    }                    }              },              ]           });                     center.setActiveTab(0);                                            var viewport = new Ext.Viewport({                layout : 'border',               items : [ form1,                   { region : 'center',layout : 'border', items : [form2, center] }               ]           });                      });

顶 0 踩 0     上一篇EXTjs 的ajax返回的response对应url中的数据, 下一篇Gridpanel数据加载成功后,触发事件,让表格第一行的数据显示在下面的formpanel

我的同类文章

EXTJS（7） •form中的button,添加在内部,多了一条线,解决办法2011-08-03阅读441•extjs 下拉框取值2011-07-15阅读1735•extjs项目案例2011-07-14阅读3358•extjs的例子2011-07-14阅读427 •Gridpanel数据加载成功后,触发事件,让表格第一行的数据显示在下面的formpanel2011-07-22阅读1819•Extjs RadioGroup中Radio的切换2011-07-14阅读1458•功能强大的EXTJS的tree的节点操作2011-07-14阅读1741 猜你在找 Git代码管理工具速成视频课程 大规模敏捷需求管理 分布式资源管理系统的前世今生，深入剖析YARN资源调度架构 2016软考系统集成项目管理工程师视频教程精讲 基础知识（下） PHP面向对象设计模式 给jsp页面加图片加载不出来的解决办法 37-002-1 通过spring的OpenSessionInViewFilter解决jsp页面懒加载显示的问题 JSP页面加载xls表格数据 当jsp页面完全加载完成后执行一个js函数 struts2实现首次打开默认jsp页面预加载数据库表的读取 查看评论 1楼  tanwencan 2011-09-29 11:29发表 [回复] 当同时加载多个tabpanel的时候,也能够实现多个tabpanel都刷新吗？