ファイルサーバーのディレクトリ一覧を表示するjsTreeインスタンスを作成しています。私はjsTreeの "サブフォルダ"または "サブディレクトリ"ノードをオープン可能なものとして表示するのが難しいです。レンダリングされたjsTreeがJSONデータノードの「閉じた」状態を反映していない
フォルダノードのJSON state
はclosed
ですが、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
ディレクティブ:私はルート・ノードを開くと
、私は、ルートノードの下にフォルダとファイルのリストを参照してください。
の正しいicon
とtitle
データは、フォルダやファイルのために示されています。
ただし、各フォルダの横に開閉の三角がありません。 (理論的にオープンすると、開いているサブディレクトリのフォルダとファイルのリストをAjaxコールで呼び出すことになります)。
私のJSON出力または最初の$("#fileTree").jstree()
の設定でどのように誤って設定したのですか? /近い三角形が表示されないようにしますか?
ありがとうございました!