显示数据库中的分层数据

本文关键字:分层 数据 数据库 显示 | 更新日期: 2023-09-27 17:53:32

我正在一个项目的前端工作,该项目的任务是显示一些在数据库中组织为分层的数据。我还没有与这些类型的数据类型和我的第一个去是gridview,它只显示"父",没有下面的数据。我已经谷歌了几个选项,但大多数看起来像他们使用ADO。. NET或Linq查询数据库,而我需要的后端与实体框架实现的选项。我的后端开发人员设置了这个方法来返回资产数据:

public List<AssetEntity> GetAllAssets()
{
    List<AssetEntity> getAllAssets = dal.SelectAsset(1);
    Error = dal.Error;
    return getAllAssets;
}

树形视图听起来像我最好的选择,但我不确定什么控制或如何实现这与EF。有线索吗?谢谢!

显示数据库中的分层数据

在html中显示树可以通过嵌套无序列表来完成:

<ul class="tree">
    <li><div>Item 1</div></li>
    <li><div>Item 2</div></li>
    <li><div>Item 3</div>
        <ul>
            <li><div>Item 3.1</div></li>
            <li><div>Item 3.2</div>
                 <ul>
                    <li><div>Item 3.2.1</div></li>
                    <li><div>Item 3.2.2</div></li>
                </ul>
            </li>
        </ul>
    </li>
</ul>

一些css使它看起来更像树:

ul
{
    list-style:none;
    /*list-style-image: url('your_image_url_here')*/
}

和jQuery展开/折叠子节点点击:

$(function(){
    $(".tree li div").click(function()
        {
            var children = $(this).parent("li").children("ul");
            if(children.length > 0)
            {
                if(children.is(":visible"))
                {
                   children.hide();
                }
                else
                {
                   children.show();
                }
            }   
        });
});

完整示例:http://jsfiddle.net/eQxTs/5/

你可以通过为每个资产列表使用局部视图或显示模板来呈现列表。通过在每个assetenity中使用相同的PartialView迭代子集合,您将获得递归,使其成为树。

剃刀:

@model IEnumerable<AssetEntity>
<ul>
@foreach (var item in Model)
{
       <li>@item.Name
          @Html.DisplayFor(m => item.Children)
       </li>
}
</ul>