2012-10-18 41 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); 
});