我试图返回jtree中选定节点的路径。我需要节点的整个路径
我有一个生成json的php文件,像这样:
header("Content-Type: application/json; charset=utf8");
echo json_encode(dir_to_jstree_array("/my_path"));
function dir_to_jstree_array($dir, $order = "a", $ext = array()) {
if(empty($ext)) {
$ext = array ("jpg", "gif", "jpeg", "png", "doc", "xls", "pdf", "tif", "ico", "xcf", "gif87", "scr" );
}
$listDir = array(
'text' => basename($dir),
'icon' => 'jstree-folder',
'children' => array()
);
$files = array();
$dirs = array();
if($handler = opendir($dir)) {
while (($sub = readdir($handler)) !== FALSE) {
if ($sub != "." && $sub != "..") {
if(is_file($dir."/".$sub)) {
$extension = trim(pathinfo($dir."/".$sub, PATHINFO_EXTENSION));
$files []= $sub;
}
elseif (is_dir($dir."/".$sub)) {
$dirs []= $dir."/".$sub;
}
}
}
if($order === "a") {
asort($dirs);
}
else {
arsort($dirs);
}
foreach($dirs as $d) {
$listDir['icon'] = 'jstree-file';
$listDir['children'][]= dir_to_jstree_array($d);
}
if($order === "a") {
asort($files);
}
else {
arsort($files);
}
foreach($files as $file) {
$listDir['icon'] = 'jstree-file';
$listDir['children'][]= $file;
}
closedir($handler);
}
return $listDir;
}
而加载javascript的php函数是:
function load_js() {
echo ' <link rel="stylesheet" type="text/css" href="/css/jstree/dist/themes/default/style.min.css" />
<script type="text/javascript" src="/js/jquery.js"></script>
<script type="text/javascript" src="/js/jstree/dist/jstree.min.js"></script>
<script type="text/javascript">
function on_load_padrao() {
$(''#jstree_demo_div'').jstree({
''core'' : {
''data'' : {
''type'' : "POST",
''url'' : ''mypath/dir2json.php'',
''data'' : function (node) {
return { ''id'' : node["id"]};
}
},
''dataType'' : ''json''
},
''plugins'' : ["checkbox" ]
})
.on("changed.jstree", function (e, data) {
console.log(data.selected.get_path());
});
</script> ';
}
我试图用我在文档中看到的函数获取路径:get_path(),但这不起作用。当我调试它时,我得到了以下错误:
ReferenceError: get_path is not defined
我错过了什么?
@oerl说我用错了函数,所以这是正确的方式:
.
.
.
$(''#jstree_demo_div'').jstree(true).get_path(data.node, "/")
$(''#jstree_demo_div'').jstree(true).get_path(data.node,"/");
var selectedNodes = $(''#jstree_demo_div'').jstree(true).get_selected();
for(var node in selectedNodes) {
var path = $(''#jstree_demo_div'').jstree(true).get_path(data.node,"/");
}
.
.
.
我希望这能帮助别人,就像帮助过我一样! 您使用了错误的函数。你必须这样使用它:
$(''#jstree_demo_div'').jstree(true).get_path(data.node,"/");
也要获得选定的节点,你必须使用:
var selectedNodes = $(''#jstree_demo_div'').jstree(true).get_selected();
最后要回答您的问题,遍历selectedNodes并在每个节点上调用get_path:
for(var node in selectedNodes) {
var path = $(''#jstree_demo_div'').jstree(true).get_path(node,"/");
}
希望对你有帮助。
这是一个经过测试的工作示例,我使用来自帖子和评论的信息想到了什么,到目前为止,似乎没有一个完整的解决方案指定的帖子。我使用jQuery v1.11.0的jsTree在lib文件夹下,jsTree期望它是。代码语法已被pyCharm检查。
var file_data = [];
// object that represents the DIV for the jsTree
var objTreeView = $("#div_treeview");
// returns a list of <li> ID's that have been sected by the user
var selectedNodes = objTreeView.jstree(true).get_selected();
// This is the best way to loop object in javascript
for (var i = 0; i < selectedNodes.length; i++) {
// get the actual node object from the <li> ID
var full_node = objTreeView.jstree(true).get_node(selectedNodes[i]);
// Get the full path of the selected node and put it into an array
file_data[i] = objTreeView.jstree(true).get_path(full_node, "/");
}
// Convert the array to a JSON string so that we can pass the data back to the server
// once the user submits the form data
alert(JSON.stringify(file_data));