我想进行ajax调用来获取结果节点的数据。在我的示例代码中(see here)进行了 ajax 调用，但服务器没有返回任何内容(使用 firebug 进行测试)，但如果我在 Web 浏览器中使用相同的 url，我可以保存 json 文件。
我的问题是:
- 如何使 ajax 调用正常工作，以便返回值显示在 jsTree 中？效果很好here - 搜索
同时使用数据和ajax配置选项 - 如何传递ajax调用参数
- 其中一个是父/父名称(第一个结果节点的基本)
- 第二个是父节点的名称(第一个结果节点的登录)
请参阅下面的代码或使用 fiddle
<html>
<head>
<title>jsTree & ajax</title>
<script type="text/javascript" src="http://static.jstree.com/v.1.0pre/jquery.js"></script>
<script type="text/javascript" src="http://static.jstree.com/v.1.0pre/_docs/syntax/!script.js"></script>
<script type="text/javascript" src="http://static.jstree.com/v.1.0pre/jquery.cookie.js"></script>
<script type="text/javascript" src="http://static.jstree.com/v.1.0pre/jquery.hotkeys.js"></script>
<script type="text/javascript" src="http://static.jstree.com/v.1.0pre/jquery.jstree.js"></script>
<script type='text/javascript'>
data = [
{
"data" : "Basics",
"state" : "closed",
"children" : [ {
"data" : "login",
"state" : "closed",
"children" : [ "login", {"data" : "results", "state" : "closed"} ]
} ,
{
"data" : "Basics",
"state" : "closed",
"children" : [ "login", "something",{"data" : "results", "state" : "closed"} ]
} ]
},
{
"data" : "All",
"state" : "closed",
"children" : [ {
"data" : "AddCustomer",
"state" : "closed",
"children" : [ "login","Add", {"data" : "results", "state" : "closed"} ]
} ]
}
]
$(function () {
$("#jstree").jstree({
"json_data" : {
"data" : data ,
"ajax" : { "url" : "http://www.jstree.com/static/v.1.0pre/_docs/_json_data.json" }
},
"plugins" : [ "themes", "json_data" ]
});
});
</script>
</head>
<body>
<div id="jstree"></div>
</body>
</html>
更新 1
即使我将示例代码从 jstree.com 复制到 jsfiddle这是行不通的。我想我在某个地方遗漏了一些东西......
最佳答案
尽量不要从您的服务器向另一台服务器进行 Ajax 调用 - 这将导致跨域安全异常。有多种解决方法(JSONP)，但从您自己的服务器请求数据更简单。
一旦你整理好你的ajax请求，你可能想要添加一些属性到你的“结果”节点，以便ajax有一些它可以 Hook 的数据，例如身份证。像这样的东西:
"data": "results", "state": "closed", "attr": { "id": "node-123" }
然后您可以为 ajax 数据选项添加处理程序:
"ajax": {
"url": "/my/local/json/",
"data": function(n) {
// get parent / grandparent node
var lists = $(n).parents('ul');
var p = $(lists[0]).prev('a');
var gp = $(lists[1]).prev('a');
// the result is fed to the AJAX request 'data' option
return {
"parent": $.trim(p.text()),
"grandparent": $.trim(gp.text()),
"id": n.attr ? n.attr("id").replace("node-", "") : 1,
};
}
}
这应该会产生一个 Ajax 请求，例如:http://myserver/my/local/json/?parent=login&grandparent=Basics&id=123
希望有帮助。
编辑:这里有一个更新的 JsFiddle 供您使用:http://jsfiddle.net/robgallen/3uCX3/
关于jquery-plugins - 如何在jsTree中进行json ajax调用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/6702313/