2014-05-21 1 views
3

jstree에서 선택한 노드의 경로를 반환하려고합니다. 노드의 전체 경로가 필요합니다.노드에서 반환 경로 jstree

나는이처럼 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; 
} 

그리고 내 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이

내가 무엇을 놓치고 정의되지 않는 이유는 무엇입니까? 나에게 도움이 같은

     . 
         . 
         . 
$(\'#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,"/"); 
} 
         . 
         . 
         . 

내가이 사람을 도울 수 있기를 바랍니다 :

UPDATE @oerl 내가 잘못된 기능을 사용하고 있었다, 그래서 이것은 올바른 방법이라고 나에게 말했다!

답변

5

잘못된 기능을 사용 중입니다. 이처럼 사용할 수 있습니다

또한
$(\'#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,"/"); 
} 

희망이 있습니다.

+0

감사합니다! 나는 네가 나에게 제안한 것을했다. 선택된 노드의 경우 노드의 ID를 얻었습니다. 그러나 그 길은 내가 길을 얻지 못했고, 단지'path = false'를 돌려줍니다. 무엇이 잘못 될 수 있는지 알고 있습니까? 그리고 나는 의심 스럽지만 ... 왜 함수를 호출하기 전에'.jstree (true) '를 사용해야합니까? – mailazs

+0

.jstree (true)에서 http://www.jstree.com/api/#/?f=$.jstree를 읽으십시오. 경로 문제에 관해서는, 아마 get_path는 id뿐 아니라 전체 노드를 필요로합니다. 'var full_node = $ (\ '# jstree_demo_div \') .jstree (true) .get_node (node);로 노드를 먼저 얻고 full_node로 get_path를 호출하십시오. – oerl

+0

흠, 나는 그것을 읽을 것이다. 정말 고맙습니다. 어쨌든, 누락 된 것을 발견했다 ... 내 코드의 올바른 형식은'$ (\ '# jstree_demo_div \') .jstree (true) .get_path (data.node, "/")'이다. 감사합니다. @oerl! :) – mailazs

1

게시물에 지정된 완벽한 솔루션이 아닌 것처럼 보이는 게시물 및 의견의 정보를 사용하여 작성한 테스트 된 작동 예제입니다. jsTree가 기대하는 libs 폴더 아래에서 jsTree에 jQuery v1.11.0을 사용하고 있습니다. 코드 구문은 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));

+0

당신은') .get_selected (true);'를 사용하여 조금 단순화 할 수 있습니다. 그러면 ID 대신 완전한 노드를 얻을 수 있습니다. 그런 다음 for 루프에서'var full_node (..)'를 제거 할 수 있습니다. –