2

我正在开发一个包含 2 个 ajax 元素的应用程序。在页面的左侧，我使用 JsTree 进行导航，在右侧，我正在显示搜索表单，其中包含与单击的 Tree 元素相关的数据表内容。当用户在右侧页面上搜索/过滤时，树中的相关节点应重新加载以显示过滤后的内容。这类似于 Windows 文件资源管理器或 Eclipse 资源管理器（带同步）。

单击搜索表单中的搜索按钮时，树中当前选定的节点应重新加载：我可以使用 set settings 在 jsTree 中设置新的 url。（警报显示新网址）。但是，当节点刷新时，它会使用 jsTree 初始化期间指定的 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"]

})

4

1 回答 1

1 
$('#treeElement').bind("select_node.jstree", function(e,data) {
    var obj = $("#treeElement").jstree("get_selected");
    var tree = jQuery.jstree._reference("#treeElement");
    tree.refresh(obj);
});
于 2012-10-25T07:07:38.167 回答