我基本上使用自定义界面来显示和隐藏目录树中的项目。 id仅在其文件夹时分配给元素,并且所有文件夹内容(其他元素)的名称都等于父级的id。现在show hide作为研究员:
$(".directory-item").click(function () {
$('div[name=' + this.id + ']').toggle();
});
除非现在我需要在点击时折叠子文件夹或子文件夹,否则效果很好。所以代码必须是这样的:
$(".directory-item").click(function () {
$('div[name=' + this.id + ']').toggle();
$('div[name=' + this.id + ']').each(function(){
var each_id = this.id; //NEW ID FROM .each NOT .click
$('div[name=' + each_id + ']').toggle();
});
});
当然,这并不能说明所需的递归。简而言之,扩展文件夹很棒......但如果你收缩一个打开子文件夹的文件夹,它们就会保持打开状态。
HTML /剃刀:
<div class="folder-explorer">
@{
var parentFolder = "";
}
@for (int i = 0; i < ViewBag.fullHierarchy.Count; i++) {
var item = ViewBag.fullHierarchy[i];
//Set Previous item when applicable
int indent_level = (item.Level - 1) * 25 + 10;
string display = "";
string item_type = item.Type;
string icon_type = "";
var item_name = "";
var item_id = "";
//Set item visibility
if (item.Level == 1) {
display = "block";
}
else {
display = "none";
}
//Set item icon
if (item_type == "folder") {
icon_type = "fa-folder";
}
else {
icon_type = "fa-file";
}
//Always assign ID, only if its a folder
if (item_type == "folder") {
item_id = item.ItemName;
}else {
item_id = "";
}
//Set item name to parent folder
if (item.Level > 1) {
var previous_item = ViewBag.fullHierarchy[i - 1];
item_name = item.Parent;
if (item.Level > previous_item.Level) {
@:<div name="@item_name">
}
else if (item.Level < ViewBag.fullHierarchy.Count) {
var next_item = ViewBag.fullHierarchy[i + 1];
if (item.Level < next_item.Level) {
@:</div>
}
}
}
<div class="directory-item" id="@item_id" name="" style="padding-left: @(indent_level)px; display: @(display)">
<i class="fa @icon_type"></i>
@item.ItemName (id: @item_id, name: @item_name, level: @item.Level)
<i class="fa fa-angle-right float-right"></i>
</div>
}
</div>
控制器:为简洁而排除,只需将内容分配给视图包
型号:
public void FullDirList(DirectoryInfo d) {
count_hierarchy += 1;
int directory_level = count_hierarchy;
// Console.WriteLine("Directory {0}", dir.FullName);
// list the files
try {
foreach (FileInfo f in d.GetFiles()) {
//Console.WriteLine("File {0}", f.FullName);
files.Add(f);
HierarchyItem file = new HierarchyItem();
file.ItemName = f.Name;
file.Type = "file";
file.Level = directory_level;
var dirName = new DirectoryInfo(f.Directory.ToString()).Name;
file.Parent = dirName.ToString();
fullHierarchy.Add(file);
}
}
catch {
Console.WriteLine("Directory {0} \n could not be accessed!!!!", d.FullName);
return; // We alredy got an error trying to access dir so dont try to access it again
}
// process each directory
// If I have been able to see the files in the directory I should also be able
// to look at its directories so I dont think I should place this in a try catch block
foreach (DirectoryInfo e in d.GetDirectories()) {
folders.Add(e);
HierarchyItem file = new HierarchyItem();
file.ItemName = e.Name;
file.Type = "folder";
file.Level = directory_level;
file.Parent = e.Parent.ToString();
fullHierarchy.Add(file);
FullDirList(e);
}
count_hierarchy -= 1;
}
我真正想做的事情:onclick,show / hide next level。它本质上是一个目录浏览器。我让它为扩展而努力,但是当我点击雇用者时,子级别不会崩溃,所以我决定尝试将每组孩子包裹在一个以其父母命名的div中...但这并不是似乎很容易。