我想进行ajax调用以获取结果节点的数据.在我的示例代码
(see here)中进行了ajax调用,但是服务器没有返回任何东西(使用firebug测试)但是如果我在Web浏览器中使用相同的url,我可以保存json文件.
我的问题是:
>如何使ajax调用工作,以便返回值显示在jsTree中?它工作得很好here – 搜索使用数据和& ajax配置选项
>如何传递ajax调用参数
>一个是父/父名称(第一个结果节点的基础)
>第二个将是父节点的名称(第一个结果节点的登录名)
<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","children" : [ "login",{"data" : "results","state" : "closed"} ] },{ "data" : "Basics","something","state" : "closed"} ] } ] },{ "data" : "All","children" : [ { "data" : "AddCustomer","Add","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
解决方法
尽量不要从服务器到另一台服务器进行Ajax调用 – 这将导致跨域安全性异常.有很多方法(JSONP),但只是从您自己的服务器请求数据更简单.
一旦你整理出你的ajax请求,你可能想要为你的“结果”节点添加一些属性,以便ajax有一些它可以挂钩的数据,例如标识.就像是:
"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/