2011-02-07 27 views
1

ファイルサーバーのディレクトリ一覧を表示するjsTreeインスタンスを作成しています。私はjsTreeの "サブフォルダ"または "サブディレクトリ"ノードをオープン可能なものとして表示するのが難しいです。レンダリングされたjsTreeがJSONデータノードの「閉じた」状態を反映していない

フォルダノードのJSON stateclosedですが、jsTreeの表示にはそのノードの開閉の三角形は表示されません。ここで

は私#fileTreeの初期設定です:

$("#fileTree") 
    .jstree({ 
     "core" : { 
      "initially_open" : [ "root" ] , 
      "html_titles" : false 
     }, 

     "json_data" : {     
      "progressive_render" : true,     
      "data" : [ 
       { 
        "data" : { title : "/home/" + username }, 
        "attr" : { 
         "id" : "/home/" + username, 
         "rel" : "root", 
         "href" : "file://home/" + username 
        },   
        "icon" : "/js/_demo/home.png", 
        "state" : "closed" 
       } 
      ], 
      "ajax" : { 
       "url" : "/services/listDirectoryContents.pl", 
       "data" : function (n) { 
        return { id : n.attr ? n.attr("id") : "/home/" + username }; 
       } 
      } 
     }, 

     "themes": { 
      "theme": "default", 
      "dots": true, 
      "icons": true, 
      "url": "/js/themes/default/style.css" 
     }, 

     "plugins" : [ "core", "themes", "json_data" ] 
    }); 

ajaxのサブセクションから呼び出さ/services/listDirectoryContents.plスクリプトは、クエリの引数としてパスを受け取り近いRESTfulなスクリプトです(のidにあるものノード)。

サービスは、JSON形式(maxdepth = 1)のディレクトリとファイルの配列を、jsTreeで使用される表示属性と共に出力します。ここで

は、ルートノードとして/home/areynoldsを使用して、このサービスの出力例:私のWebページ上

$ ./listDirectoryContents.pl /home/areynolds 
Status: 200 OK 
Content-Type: text/html; charset=ISO-8859-1 

[ 
    { 
     "data" : { 
     "icon" : "/js/_demo/folder.png", 
     "title" : "projects", 
     "attr" : { 
      "rel" : "folder", 
      "href" : "file:///home/areynolds/projects", 
      "id" : "/home/areynolds/projects" 
     }, 
     "state" : "closed" 
     } 
    }, 
    { 
     "data" : { 
     "icon" : "/js/_demo/folder.png", 
     "title" : "proj", 
     "attr" : { 
      "rel" : "folder", 
      "href" : "file:///home/areynolds/proj", 
      "id" : "/home/areynolds/proj" 
     }, 
     "state" : "closed" 
     } 
    }, 

    ... 

    { 
     "data" : { 
     "icon" : "/js/_demo/file.png", 
     "title" : "test.bed", 
     "attr" : { 
      "rel" : "file", 
      "href" : "file:///home/areynolds/test.bed" 
     } 
     } 
    } 
] 

、ルートノード(例えば/home/areynolds)最初は閉じている - 興味深いことに、coreプラグインのにもかかわらず、 initially_openディレクティブ:私はルート・ノードを開くと

Closed root node

、私は、ルートノードの下にフォルダとファイルのリストを参照してください。

Opened root node

正しいicontitleデータは、フォルダやファイルのために示されています。

ただし、各フォルダの横に開閉の三角がありません。 (理論的にオープンすると、開いているサブディレクトリのフォルダとファイルのリストをAjaxコールで呼び出すことになります)。

私のJSON出力または最初の$("#fileTree").jstree()の設定でどのように誤って設定したのですか? /近い三角形が表示されないようにしますか?

ありがとうございました!

答えて

0

attr属性の場所がjsTreeを作成または中断しているようです。次に、正しく動作するフォルダノードの例を示します。

[ 
... 
    { 
     "data" : { 
     "icon" : "/js/_demo/folder.png", 
     "title" : "workspace", 
     "attr" : { 
      "href" : "file:///home/areynolds/workspace" 
     } 
     }, 
     "attr" : { 
     "rel" : "folder", 
     "id" : "/home/areynolds/workspace" 
     }, 
     "state" : "closed" 
    } 
... 
] 
関連する問題