根据 data-'key' Javascript 获取父 Div 中的子 Div答案

【问题标题】：Get Child Divs inside Parent Divs according to data-'key' Javascript根据 data-'key' Javascript 获取父 Div 中的子 Div
【发布时间】：2017-04-19 04:54:21
【问题描述】：

你能帮我把子 div 放在父 div 中吗（reversevly）我在 html 中有这段代码。

我需要根据从 data-id 和 data-parent 检索到的数据将子 .wrapper div 放入父 div。提前致谢！

@model IEnumerable<Tree_List.Models.H_Table>
@{
    ViewBag.Title = "Index";
}
@*<script src="~/Scripts/ListControlScript.js"></script>*@
<script src="~/Scripts/jquery-1.10.2.min.js"></script>

<div>

@foreach (var item in Model)
{
    <div id="wrapper" class="something" data-id="@item.PARENT_ID" data-parent="@item.PARENT_ID">
        <ul>
            <input type="button" class="toggler" onclick="ShowMsg()">
            <li class="roots" >
                @item.NAME
                <input class="add_btn" type="button" value="Add" />
                <input class="edit_btn" type="button" value="Edit" />
                <input class="delete_btn" type="button" value="Delete" />
            </li>
        </ul>
    </div>
}
</div>

<script>
    $(function () {

    });
    </script>

【问题讨论】：

从哪里检索数据？你想做什么？
@Krishna 将 div 放入 div 中，就像“父子关系”一样，使用来自数据库的 data-id 和 data-parent 中的数据作为连接。
所以如果 parent Id 为 null 那么它是一个父母，如果它有一个父母 id 它是孩子对吗？
@Krishna 是的，完全正确

标签： javascript jquery html asp.net model-view-controller

【解决方案1】：

    @model IEnumerable<Tree_List.Models.H_Table>
    @{
        ViewBag.Title = "Index";
    }
    @*<script src="~/Scripts/ListControlScript.js"></script>*@
    <script src="~/Scripts/jquery-1.10.2.min.js"></script>

    <div>
    @helper PopulateDivs(IEnumerable<Tree_List.Models.H_Table> foos)
     {

        @foreach (var item in Model)
        {
           <div id="wrapper" class="something" data-id="@item.PARENT_ID" data-parent="@item.PARENT_ID">
          //I don't know the real structure you are looking for but this will work with recursion
             @if(Model.Any(m=> m.Parent_ID == item.ID))
               {
                  @PopulateDivs(Model.Where(m=> m.Parent_ID == item.ID))
               }
             <ul>
                <input type="button" class="toggler" onclick="ShowMsg()">
                <li class="roots" >
                    @item.NAME
                    <input class="add_btn" type="button" value="Add" />
                    <input class="edit_btn" type="button" value="Edit" />
                    <input class="delete_btn" type="button" value="Delete" />
                </li>
             </ul>
          </div>
        }

      }

     </div>

    <script>
        $(function () {

        });
        </script>

【讨论】：

如果视图展开则不起作用（这些孩子有他们的孩子）
也许在 javascript 中是可能的——类似于递归
你的意思是说你有多层次的层次结构？
是的，多级
它说“找不到命名空间Foo的类型”