Ошибки при использовании экземпляра fancytree

Я новичок в использовании fancytree. Я создал демоверсию для отображения данных в таблице на веб-странице. Теперь я надеюсь собрать данные после того, как пользователи обновили их.Ошибки при использовании экземпляра fancytree

Я использовал так называемые методы дерева, как указано в уроке. Существует пример, который имеет две строки ниже:

var tree = $("#tree").fancytree("getTree"); 

alert("We have " + tree.count() + " nodes.");

Я думал, что я могу использовать fancytree экземпляр, переменная «дерево» в приведенном выше примере, чтобы получить доступ ко всем узлам таким образом, чтобы собрать значения, которые они принимают. Но когда я помещал этот пример с двумя строками в свои коды, у меня были ошибки.

Для пояснения я наклеил полный код ниже. Ближе к концу кода есть два комментария, помеченные Place_1 и Place_2. Когда я помещал пример с двумя строками в каждом из этих двух мест, у меня были ошибки, которые: «Uncaught TypeError: undefined не является функцией» или «Ошибка нечистоты: не может вызывать методы на fancytree до инициализации, попытался вызвать метод «getTree» соответственно.

Я думал, что должен что-то пропустить. Любая идея будет полезна. Благодаря!

<!DOCTYPE html> 
    <html> 
    <head> 
     <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1"> 

     <link type="text/css" rel="stylesheet" href="addtionals/jquery-ui.css" /> 
     <script src="addtionals/jquery.min.js" type="text/javascript"></script> 
     <script src="addtionals/jquery-ui.min.js" type="text/javascript"></script> 

     <link href="fancytree/src/skin-win8/ui.fancytree.css" rel="stylesheet" type="text/css"> 
     <script src="fancytree/src/jquery.fancytree.js" type="text/javascript"></script> 
     <script src="fancytree/src/jquery.fancytree.edit.js" type="text/javascript"></script> 
     <script src="fancytree/src/jquery.fancytree.table.js" type="text/javascript"></script> 

     <script type="text/javascript"> 

      var Rigid_Package_SOURCE = [ 
       {title: "Role-Based Statements", key: "1", folder: true, expanded: true, children: [ 
        {title: "Text1", key: "2"}, 
        {title: "Text2", key: "3"} 
       ]} 
       ]; 

      $(function(){ 

       $("#RB_Statements_tree").fancytree({ 
       source: Rigid_Package_SOURCE, 

       extensions: ["edit", "table"], 

       edit: { 
        triggerCancel: ["esc"], 
        triggerStart: ["f2", "dblclick", "shift+click", "mac+enter"], 
        beforeEdit: function(event, data){ 

        if (data.node.isFolder()) { 
         var title = data.node.title; 
         data.node.editEnd(); 
         data.node.setTitle(title); 
         return false; 
        }   
        }, 

        beforeClose: function(event, data){ 
        if (data.node.isFolder()) { 
        }else{ 
         if (data.input.val() == ""){ 
          data.node.setTitle(""); 
         } 
        } 
        } 
       }, 
       table: { 
        indentation: 20, 
        nodeColumnIdx: 1 
       }, 

       renderColumns: function(event, data) { 
        var node = data.node, 

        $tdList = $(node.tr).find(">td"), 

        $select = $("<select />"); 

        if(node.isFolder()) { 
        }else{ 
        $("<option > Tutor </option>").appendTo($select); 
         $("<option selected > Student </option>").appendTo($select); 
         $("<option > Teacher </option>").appendTo($select); 
         $tdList.eq(0).html($select); 
        } 
       } 
       }); 
      }); 

     </script> 
    </head> 

    <body> 

     <script type="text/javascript"> 
     //Place_1: Uncaught TypeError: undefined is not a function 
     //var tree = $("#RB_Statements_tree").fancytree("getTree"); 
     //alert("We have " + tree.count() + " nodes."); 
     </script> 

     <!--The title of this page--> 
      <h4> Vicarious Conversation</h4> 

      <!-- Table: Role-Based Statements --> 
      <table id="RB_Statements_tree"> 
      <colgroup> 
      <col width="100px"> 
      <col width="300px"> 
      </colgroup> 
      <thead> 
       <tr> <th></th> <th></th> 
      </thead> 
      <tbody> 
      </tbody> 
      </table> 
      <br> 

     <script type="text/javascript"> 
     //Place_2: Uncaught Error: cannot call methods on fancytree prior to initialization; attempted to call method 'getTree' 
     //var tree = $("#RB_Statements_tree").fancytree("getTree"); 
     //alert("We have " + tree.count() + " nodes."); 
     </script> 
    </body> 
    </html>

источник

2014-12-03 Daqi Dong

Вы пытаетесь выполнить код до инициализации fancytree, попробуйте добавить свой код в событие f createtree 'create' или, если вы добавите свой код в функцию и вызовите это с помощью кнопки или гиперссылки (например), она должна работать. –

Спасибо. Я сделал это, как вы сказали, вызывая коды с помощью кнопки. –

Спасибо за предложение от Chase.

Я думаю, что пример с двумя строками должен быть добавлен в место после завершения инициализации.

Например, я добавил коды в тело кнопки и хорошо работает. Вот пример реализации кнопки в fancytree: http://wwwendt.de/tech/fancytree/demo/#sample-source.html

источник

2014-12-04 21:57:27

Ошибки при использовании экземпляра fancytree

ответ

Смежные вопросы