jQuery MiniUI

标题: mini-tabs 动态添加tab及outlooktree 获取不到 outlooktree [打印本页]
作者: gaoyong    时间: 2015-3-15 16:25:36     标题: mini-tabs 动态添加tab及outlooktree 获取不到 outlooktree

var list = [
         { id: "base", text: "Base" },            
         { id: "ajax", text: "Ajax", pid: "base" },
         { id: "json", text: "JSON", pid: "base" },
         { id: "date", text: "Date", pid: "base" },
         { id: "control", text: "Control", pid: "base" },
         { id: "forms", text: "Forms", pid: "base" },
         { id: "button", text: "Button", pid: "forms" },
         { id: "listbox", text: "ListBox", pid: "forms" },
         { id: "checkboxlist", text: "CheckBoxList", pid: "forms" },
            { id: "lists", text: "Lists" },
         { id: "datagrid", text: "DataGrid", pid: "lists" },
         { id: "tree", text: "Tree", pid: "lists" },
         { id: "treegrid", text: "TreeGrid ", pid: "lists" }
        ];

  var item = json;
                        var tab = { title: item.OrgValue };
                        tab = tabs1.addTab(tab);
                        var el = tabs1.getTabBodyEl(tab);
                          el.innerHTML = '<div id="leftTree' + i + '" class="mini-outlooktree"  ' +
                                       '' +
                                       ' textField="name"' +
                                       ' idField="id" ' +
                                 
                                       
                                       ' parentField="pid" >' +
                                       '</div>';
                        mini.parse();
                 var tex = mini.get("leftTree' + i + '");
      
                    tex.loadList(list ,"id", "pid");
作者: dforce    时间: 2015-3-16 09:38:07

  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.     <title></title>
  6.     <script src="../../scripts/boot.js" type="text/javascript"></script>
  7. </head>
  8. <body>
  9. <button onclick="addTab()">addTab</button>
  10. <div id="tabs1" class="mini-tabs" style="width:400px;height:300px">
  11.      
  12. </div>
  13. </body>
  14. </html>
  15. <script type="text/javascript">
  16.     var list = [
  17.          { id: "base", text: "Base" },
  18.          { id: "ajax", text: "Ajax", pid: "base" },
  19.          { id: "json", text: "JSON", pid: "base" },
  20.          { id: "date", text: "Date", pid: "base" },
  21.          { id: "control", text: "Control", pid: "base" },
  22.          { id: "forms", text: "Forms", pid: "base" },
  23.          { id: "button", text: "Button", pid: "forms" },
  24.          { id: "listbox", text: "ListBox", pid: "forms" },
  25.          { id: "checkboxlist", text: "CheckBoxList", pid: "forms" },
  26.             { id: "lists", text: "Lists" },
  27.          { id: "datagrid", text: "DataGrid", pid: "lists" },
  28.          { id: "tree", text: "Tree", pid: "lists" },
  29.          { id: "treegrid", text: "TreeGrid ", pid: "lists" }
  30.         ];
  31.     mini.parse()
  32.     function addTab() {
  33.         var tabs1 = mini.get("tabs1");
  34.         var tab = { title: "tab1" }
  35.         tabs1.addTab(tab);
  36.         tabs1.activeTab(tab);
  37.         var el = tabs1.getTabBodyEl(tab);
  38.         el.innerHTML = '<div id="leftTree1" class="mini-outlooktree" ></div>';
  39.         mini.parse();
  40.         var tree = mini.get("leftTree1")
  41.         tree.loadList(list, "id", "pid");
  42.     }
  43. </script>
复制代码
按你的代码可以生成



欢迎光临 jQuery MiniUI (http://miniui.com/discuss/) Powered by Discuz! X2