2012-10-18 37 views
2

我正在開發一個帶有2個Ajax元素的應用程序。在頁面的左側,我使用JsTree進行導航,右側顯示帶有與點擊的Tree元素相關的數據表單內容的搜索表單。當用戶在右側頁面上搜索/過濾時,樹中的相關節點應該重新加載以顯示過濾的內容。 這與Windows文件資源管理器或Eclipse資源管理器類似(具有同步功能)。用JStree中的新URL重新加載節點

論搜索點擊搜索按鈕的形成樹當前選擇的節點應該重新加載: 我能夠設置jsTree使用set設置新的URL。 (警報顯示新的網址)。 但是,當節點刷新時,使用jsTree init期間指定的URL刷新它。 請幫我用新的URL重新加載節點。 (注:爲動作進行是該樹外的按鈕,我不能用綁定的事件與樹。)

$('#searchbtn').live('click', function() { 
var tree = jQuery.jstree._reference("#tree_container"); 
var currentNode = tree._get_node($(".jstree-clicked"), false); 
settings = jQuery("#tree_container").jstree('get_settings'); 
settings.json_data.ajax.url = "<%= request.getContextPath() %>"/inventory/tree/getTree?search=abcd 
jQuery("#tree_container").jstree('set_settings', settings); 
alert("new settings url: "+settings.json_data.ajax.url); 
tree.refresh(currentNode); 
}); 

$(function() { 
    var tree = $("#tree_container") 
     .jstree({ 
     "json_data" : { 
      "ajax" : { 
       "url" : "<%= request.getContextPath() %>/inventory/tree/getTree", 
     "data": function (n) { 
      return { 
      "operation": "get_children", 
      "id": n.attr ? n.attr("id").replace("node_", "") : 0, 
      "elementType": n.attr ? n.attr("elementType") : "notdefined", 
      "page": n.attr ? n.attr("page") : "nopage" 
      }; 
    } 
    } 
}, 
"types": { 
    "types": { 
    "max_children": -2, 
    "max_depth": -2 
    } 
}, 
"ui": { 
    "initially_select": ["node_1"] 
}, 
"core": { 
    // just open those two nodes up 
    // as this is an AJAX enabled tree, both will be downloaded from the server 
    "initially_open": ["node_1"] 
}, 
"themes": { 
    "theme": "classic", 
    "dots" : true, 
     "url" : "assets/css/tree/classic/style.css" 
}, 
"plugins": ["themes", "json_data", "ui", "types", "hotkeys"] 

})

回答

1
$('#treeElement').bind("select_node.jstree", function(e,data) { 
    var obj = $("#treeElement").jstree("get_selected"); 
    var tree = jQuery.jstree._reference("#treeElement"); 
    tree.refresh(obj); 
});