如何在acitree中重新加載json數據

我想知道是否有任何可能的方式來刷新從服務器接收到的json對象的aciTree實例。如何在acitree中重新加載json數據

讓我們假設我有一個html輸入字段。
用戶鍵入內容並單擊提交按鈕。
此輸入用於通過ajax調用從服務器獲取新版本的json樹模型。

工作正常。但是，當我在輸入字段中再次鍵入新值並提交時，aciTree不會反映新值。它仍然顯示舊的json對象數據。
這是我的代碼。

User Name: <input type="input" id="name" name="name"> 
      <input type="submit" value="search" id="call" >

<script type="text/javascript"> 
 

 
    $(document).ready(function(){ 
 

 
// Makes the ajax call and fetches the json for the resource tree. 
 
$('#call').click(function(){ 
 

 
    $("#tree").aciTree({ 
 
\t ajax: { 
 
     url: 'treeview/jsp/testplansjson.jsp?sname='+document.getElementById("name").value+', 
 
\t \t } 
 
    }); 
 
    }); 
 
    
 
    // Refreshing the tree view - Destroy and recreate 
 
    $('#call').click(function(){ 
 
    var api = $('#tree').aciTree('api'); 
 
    api.unload(null, { 
 
     success: function() { 
 
     this.ajaxLoad(null); 
 
     // Triggering the click handler of the Get Tree View button. 
 
     // This will make the ajax call again and bind the tree... 
 
     $('#call').trigger('click'); 
 
     } 
 
    }); 
 
    }); 
 
    
 
    // ACI Tree - event handler. 
 
    $('#tree').on('acitree', function(event, aciApi, item, eventName, opt) { 
 
    switch (eventName) { 
 
     case 'focused': 
 
     case 'selected' : 
 
     // Fired when an item in the tree is selected. 
 
     if(item) { 
 
     $currStatus.text('Selected - ' + item.context.innerText); 
 
     } 
 
     } 
 
    }); 
 
}); 
 
</script>

<div id="tree" class="aciTree aciTreeNoBranches aciTreeFullRow" style="width:100%;height:auto;margin:0;padding:0;border-left:0;border-right:0"></div>

請讓我知道是否有任何的方式來實現這一目標。

來源

2015-02-06 gihan

$(_selector_).aciTree(_options_)調用將初始化樹視圖一次（使用提供的選項）。如果你把它叫兩次，什麼都不會發生。爲了能夠使用其他選項初始化樹視圖，您需要首先銷燬它。

你的情況，你只需要更新樹視圖ajax.url選項。首先卸載樹，然後從新的url重新加載它。

要在運行時更新其中一個aciTree選項，請使用option方法。請注意，您可以使用點符號，達到深層次的屬性：

api.option('ajax.url', '_your_new_url_');

然後就可以調用卸載/ ajaxLoad（如你的例子）。

來源

2015-02-15 05:39:02 Dragos

非常感謝你much.Now預期其工作:) – gihan 2015-02-16 04:56:25

<script type="text/javascript"> 
 
    
 
$(document).ready(function(){ 
 
\t 
 

 
    
 
    // Makes the ajax call and fetches the json for the resource tree. 
 
    $('#call').click(function(){ 
 
    \t 
 
\t \t $("#tree").aciTree({ 
 
\t \t  ajax : { 
 
\t \t  \t 
 
\t \t \t  url: 'treeview/jsp/testplansjson.jsp?sname='+document.getElementById("name").value+', 
 
\t \t \t  
 
\t \t  } 
 
\t  }); 
 
    }); 
 
    
 
    // Refreshing the tree view - Destroy and recreate 
 
    $('#call').click(function(){ 
 
\t \t var api = $('#tree').aciTree('api'); 
 
\t \t 
 
     api.unload(null, { 
 
      success: function() { 
 
       this.ajaxLoad(null); 
 
       // Triggering the click handler of the Get Tree View button. 
 
       // This will make the ajax call again and bind the tree... 
 
       $('#call').trigger('click'); 
 
       
 
       
 
      } 
 
     }); 
 
    }); 
 
    
 
    // ACI Tree - event handler. 
 
    $('#tree').on('acitree', function(event, aciApi, item, eventName, opt) { 
 
     switch (eventName) { 
 
      case 'focused': 
 
      case 'selected' : 
 
       // Fired when an item in the tree is selected. 
 
       if(item) { 
 
       \t $currStatus.text('Selected - ' + item.context.innerText); 
 
       } 
 
     } 
 
    }); 
 
}); 
 
</script>

<div id="tree" class="aciTree aciTreeNoBranches aciTreeFullRow" style="width:100%;height:auto;margin:0;padding:0;border-left:0;border-right:0"></div>

來源

2015-12-19 09:27:49

儘管此代碼可以回答這個問題，它會更好，包括它是如何工作的一些解釋。一個大部分只包含代碼的答案（即使它正在工作）通常不會幫助OP瞭解他們的問題。 – honk 2015-12-19 10:20:56

如何在acitree中重新加載json數據

回答

相關問題