设为首页收藏本站

jQuery MiniUI

 找回密码
 立即注册
jQuery MiniUI › 论坛 › MiniUI › 技术交流 › outlooktree布局中，如何在west里弹出一个tab页签 ...
12下一页
返回列表 发新帖
查看: 5902|回复: 10
打印 上一主题 下一主题

outlooktree布局中，如何在west里弹出一个tab页签 [复制链接]

jinhy

Rank: 3Rank: 3
跳转到指定楼层
楼主
发表于 2013-8-13 18:02:02 |只看该作者 |倒序浏览
也就是说west页面本身再弹出一个新的tab页签？

如图所示，实现“新增”按钮再弹出一个tab

附件: 你需要登录才可以下载或查看附件。没有帐号？立即注册

举报

factory

Rank: 8Rank: 8
沙发
发表于 2013-8-13 22:30:57 |只看该作者
其实这样问题是老问题了。
你的tab内部的是url加载的一个页面吧？这属于跨页面操作的问题，跟跨页面传值一个道理

1.在你父页面，也就是mini-tabs所在的页面，写一个新增tab的方法叫abc()
2.在你的子页面，通过window.Owner.abc()来调用父页面的这个新增方法就行了

PS传递参数也一样，在方法里面带参数就行了,abc(data)

举报

jinhy

Rank: 3Rank: 3
板凳
发表于 2013-8-27 17:57:24 |只看该作者
factory 发表于 2013-8-13 22:30
其实这样问题是老问题了。
你的tab内部的是url加载的一个页面吧？这属于跨页面操作的问题，跟跨页面传值一 ...

tab标签打开多个（满屏）后，消失

是个bug~！

举报

felt

Rank: 8Rank: 8
地板
发表于 2013-8-28 10:26:38 |只看该作者
tab标签打开多个（满屏）后

能提供个重现的例子吗？
应该满了之后出现按钮的。

举报

jinhy

Rank: 3Rank: 3
5#
发表于 2013-8-28 11:16:42 |只看该作者
felt 发表于 2013-8-28 10:26
能提供个重现的例子吗？
应该满了之后出现按钮的。


导航消失，满屏消失


导航消失前，未满屏


附件: 你需要登录才可以下载或查看附件。没有帐号？立即注册

举报

felt

Rank: 8Rank: 8
6#
发表于 2013-8-28 13:16:50 |只看该作者
把出错的html页面打包上来吧，我们重现不出来。

举报

factory

Rank: 8Rank: 8
7#
发表于 2013-8-28 13:49:00 |只看该作者
jinhy 发表于 2013-8-28 11:16
导航消失，满屏消失

更新miniui

举报

jinhy

Rank: 3Rank: 3
8#
发表于 2013-8-29 17:03:54 |只看该作者
factory 发表于 2013-8-28 13:49
更新miniui

已经是最新版本

举报

jinhy

Rank: 3Rank: 3
9#
发表于 2013-8-29 17:06:27 |只看该作者
felt 发表于 2013-8-28 13:16
把出错的html页面打包上来吧，我们重现不出来。

把左侧菜单面板隐藏，tab会显示出来，我只需要贴
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <head>
  5.       <meta http-equiv="content-type" content="text/html; charset=UTF-8" /><link href="/styles/demo.css" rel="stylesheet" type="text/css" />

  7.    
  8.     <script src="/js/boot.js" type="text/javascript"></script>
  9.    
  10.     <style type="text/css">
  11.     html, body{
  12.         margin:0;padding:0;border:0;width:100%;height:100%;overflow:hidden;
  13.     }
  14.     .header
  15.     {
  16.         background:url(/images/header.gif) repeat-x;
  17.     }
  18.     .header div
  19.     {
  20.         font-family:'Trebuchet MS',Arial,sans-serif;
  21.         font-size:20px;line-height:40px;padding-left:10px;font-weight:bold;color:#333;        
  22.     }   
  23.     body .header .topNav
  24.     {
  25.         position:absolute;right:8px;top:10px;        
  26.         font-size:12px;
  27.         line-height:25px;
  28.     }
  29.     .header .topNav a
  30.     {
  31.         text-decoration:none;
  32.         color:#222;
  33.         font-weight:normal;
  34.         font-size:12px;
  35.         line-height:25px;
  36.         margin-left:3px;
  37.         margin-right:3px;
  38.     }
  39.     .header .topNav a:hover
  40.     {
  41.         text-decoration:underline;
  42.         color:Blue;
  43.     }   
  44.      .mini-layout-region-south img
  45.     {
  46.         vertical-align:top;
  47.     }
  48.     </style>

  50. </head>
  51. <body>

  53. <div id="layout1" class="mini-layout" style="width:100%;height:100%;" >
  54.     <div title="头部导航" region="north" class="header" bodyStyle="overflow:hidden;" height="40" showHeader="false" showSplit="false">
  55.          <img src="/images/logo.png" style="margin-top:3px;margin-left: 10px;" />
  56.                 <div class="topNav">   
  57.             欢迎您，<?=$this->session->userdata('admin_name')?> |
  58.             <a href="">进入OA</a> |   
  59.             <a href="">退出</a>
  60.         </div>
  61.     </div>
  62.     <div title="底部" showHeader="false" region="south" style="border:0;text-align:center;" height="25" showSplit="false">
  63.         Copyright © 科技有限公司版权所有
  64.     </div>
  65.     <div title="&nbsp;&nbsp;&nbsp;&nbsp; 功能菜单" region="west" showHeader="true" bodyStyle="padding-left:10px;" showSplitIcon="true" width="230" minWidth="100" maxWidth="350">
  66.         <?include('menu.php');?>
  67.     </div>
  68.     <div title="主展示区" region="center" style="border:0;" >
  69.         <div id="mainTabs" class="mini-tabs" activeIndex="0" style="width:100%;height:100%;"  >
  70.             <div title="经营概览" iconCls="icon-tip">
  71.                 <iframe src="" id="mainframe" frameborder="0" name="main" style="width:100%;height:100%;" border="0"></iframe>
  72.             </div>
  73.         </div>
  74.     </div>
  75. </div>
  76.    
  77. <script type="text/javascript">
  78.         mini.parse();
  79.         var tree = mini.get("menu_tree");
  80.         //打开Tab
  81.         function open_tab(node){
  82.                 var tabs = mini.get("mainTabs");
  83.                 //判断Tab是否已存在
  84.                 var tid = "tab$" + node.id;
  85.                 var tab = tabs.getTab(tid);
  86.                 if(!tab){
  87.                         //创建新的Tab
  88.                         var tab = {};
  89.                         tab.title = node.text;
  90.                         tab.name = tid;
  91.                         tab.showCloseButton = true;
  92.                         tab.url = node.value;
  93.                         tabs.addTab(tab);
  94.                 }
  95.                 //激活选中的Tab
  96.                 tabs.activeTab(tab);
  97.         }
  98.         //选中树节点
  99.         function onNodeSelect(e) {
  100.                 var node = e.node;
  101.                 var isLeaf = e.isLeaf;
  102.                 if (isLeaf) {
  103.                         open_tab(node);
  104.                         tree.selectNode(node.id);
  105.                 }
  106.         }

  108. </script>

  110. </body>
  111. </html>
复制代码

举报

felt

Rank: 8Rank: 8
10#
发表于 2013-8-29 17:11:29 |只看该作者
把左侧菜单面板隐藏，tab会显示出来，我只需要贴

把静态数据和html页面打包上来。

举报

12下一页
返回列表 发新帖

Archiver|普加软件

GMT+8, 2024-11-29 18:20 , Processed in 1.060167 second(s), 10 queries .

Powered by Discuz! X2

© 2001-2011 Comsenz Inc.

回顶部