jquery.treetable.js 插件使用记录

@model List<Menu>

@Styles.Render("~/Content/plugins/jquery-treetable/css/jquery.treetable.css")

@Styles.Render("~/Content/plugins/jquery-treetable/css/jquery.treetable.theme.default.css")

 @Scripts.Render("~/Content/plugins/jquery-treetable/jquery.treetable.js")

<table id="treeTable" class="table table-striped table-bordered treetable">
                        <thead>
                            <tr>
                                <th>菜单名称</th>
                                <th>菜单URL</th>
                                <th>排序</th>
                                <th>操作</th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach (var item in Model.Where(p => p.ParentID == 0))
                            {
                                <tr data-tt-id="@item.Id">
                                    <td>@item.MenuName</td>
                                    <td>@item.MenuPath</td>
                                    <td>@item.OrderBy</td>
                                    <td>
                                    <button type="button" class="btn btn-info  btn-xs" οnclick="loadMenu(@item.Id)">编辑</button>
                                        @if (Model.Where(p => p.ParentID == @item.Id).Count() == 0)
                                        {
                                            <button type="button" class="btn btn-danger  btn-xs" οnclick="delMenu(@item.Id)">删除</button>
                                        }
                                        <button type="button" class="btn btn-primary  btn-xs" οnclick="showAddModal(@item.Id)">新增</button>
                                    </td>

                                </tr>

                                foreach (var entity in Model.Where(p => p.ParentID == @item.Id))
                                {
                                    <tr data-tt-id="@entity.Id" data-tt-parent-id="@item.Id">
                                        <td>@entity.MenuName</td>
                                        <td>@entity.MenuPath</td>
                                        <td>@entity.OrderBy</td>
                                        <td>
                                            <button type="button" class="btn btn-info  btn-xs" οnclick="loadMenu(@entity.Id)">编辑</button>
                                            <button type="button" class="btn btn-danger  btn-xs" οnclick="delMenu(@entity.Id)">删除</button>
                                        </td>
                                    </tr>
                                }
                            }
                        </tbody>

                    </table>

<script>
    $(document).ready(function () {
        $("#treeTable").treetable({
            expandable: true,
            initialState: "expanded",
            //expandable : true
            clickableNodeNames: true,//点击节点名称也打开子节点.
            indent: 30//每个分支缩进的像素数。
        });
    });
</script>