easyui树形菜单实现

easyui树形菜单实现

需求:读取路径配置中的相对路径获取对应的子文件夹及其子文件并形成树形结构,加载xml文件,输入搜索关键字匹配xml里面的value节点的值对应的contact值的集合并进行搜索

例如:输入b,找到xml里面的文本节点等于b的value节点,并找到对应的contact节点获取对应的文本节点值,结果是3,4,最后匹配的就是文件名包含b或3或4的所有文件并高亮显示

1、页面布局

<div>
    <a href="javascript:;" class="easyui-linkbutton">路径配置</a><input type="text" value="/Images" id="root_path" />
    <a id="btn_loadxml" href="javascript:;" class="easyui-linkbutton">加载xml</a><input type="text" value="/FilesHelpManager/keyword_config.xml" id="xml_path" />
    <a id="btn_search" href="javascript:;" class="easyui-linkbutton">搜索</a><input type="text" value="" id="txt_search" />
</div>
<div>
    <ul id="path_tree" checkbox="true"></ul>
</div>
<%--右键下载按钮--%>
<div id="right_download" class="easyui-menu" style="width: 120px;">
    <div onclick="Download();">
        Download
    </div>
</div>

2、初始化并加载路径配置下的所有文件夹及其子文件并形成树形目录

var $path_tree;

$(function () {

    $path_tree = $('#path_tree');
    //加载指定文件夹形成树形目录
    loadTreeDirectorys();
    //点击搜索
    $("#btn_search").on("click", tree_search);
    //点击加载xml
    $("#btn_loadxml").on("click", LoadXml);
});

//加载指定文件夹形成树形目录
function loadTreeDirectorys() {
    //页面初始化时加载页面的树形菜单
    $.post("/Handler/FilesHelpManager/FilesHelpHandler.ashx",
        {
            "action": "GetFileTree",
            "root_path": $("#root_path").val()//根目录位置
        },
    function (json) {
        $("#path_tree").tree({
            data: json,
            onContextMenu: function (e, node) {
                e.preventDefault();
                $(this).tree('select', node.target);
                //console.log(node.target);
                $('#right_download').menu('show', {
                    left: e.pageX,
                    top: e.pageY
                });
            }
        });
    }, "json");
}

3、后台读取子文件夹及其子文件

HttpRequest request;
HttpResponse response;
public void ProcessRequest(HttpContext context)
{
    request = context.Request;
    response = context.Response;
    context.Response.Buffer = true;
    context.Response.ExpiresAbsolute = DateTime.Now.AddDays(-1);
    context.Response.AddHeader("pragma", "no-cache");
    context.Response.AddHeader("cache-control", "");
    context.Response.CacheControl = "no-cache";
    context.Response.ContentType = "text/plain";

    string action = context.Request["action"];
    System.Reflection.MethodInfo methodinfo = this.GetType().GetMethod(action);
    methodinfo.Invoke(this, null);
}

public void GetFileTree()
{
    StringBuilder strResult = new StringBuilder();

    string root_path = request.Params["root_path"];

    string root_path_absolute = HttpContext.Current.Server.MapPath(root_path);

    strResult.Append("["+GetFilesTree(root_path_absolute,root_path) +"]");
    response.Write(strResult.ToString());
}

/// <summary>
/// 获取指定文件夹里的子文件夹和子文件(包括嵌套的)
/// </summary>
/// <param name="root_path_absolute">绝对路径</param>
/// <param name="root_path">相对于网站根目录路径</param>
/// <returns></returns>
private string GetFilesTree(string root_path_absolute,string root_path)
{
    StringBuilder strResult = new StringBuilder();

    string[] dirs = Directory.GetDirectories(root_path_absolute);
    dirs.ToList().ForEach(dir =>
    {
        string dir_name = dir.Substring(dir.LastIndexOf('\\') + 1);
        string dir_path = root_path+ "/" + dir_name;
        if (strResult.Length > 0)
        {
            strResult.Append(",");
        }
        string strDirs = "{\"text\":\"" + dir_name + "\",\"state\":\"closed\",\"attributes\":{\"dir_src\":\"" + dir_path + "\"},\"children\":[" + GetFilesTree(dir, dir_path) + "]}";

        strResult.Append(strDirs);
    });

    string[] files = Directory.GetFiles(root_path_absolute);
    files.ToList().ForEach(file =>
    {
        string filename = file.Substring(file.LastIndexOf('\\') + 1);
        if (strResult.Length > 0)
        {
            strResult.Append(",");
        }
        string strFiles = "{\"text\":\"" + filename + "\",\"attributes\":{\"file_src\":\"" + root_path+"/"+ filename + "\"}}";
        strResult.Append(strFiles);
    });

    return strResult.ToString();
}
后台读取子文件夹及其子文件

相关文章: