SQL数据回填到树形控件

这简单介绍使用一下树形控件如何让数据库直接回填数据

有需要使用这个树形控件的可以留言私信

我这里用到的插件比较多 如果觉得麻烦的也可以到layui上找一个合适的

下面先来看一下效果图

我这里只有三级的嵌套，如果需要更多可以按照下面的方法以此类推，废话不多说上代码

<script type="text/javascript">
        $(function () {
            $("#browser").treeview();
            aTexts()
        });

        function aTexts() {
            var searchText = $("#searchText").val();
            // $.ajaxSettings.async = false;//改为同步传输
            $.post("/AdmissionInformation/PatientInformation/Query", { searchText: searchText }, function (mys) {
                //科室
                $("#browser").empty();
                for (var i = 0; i < mys.querySection.length; i++) {
                    var SectionName = mys.querySection[i].SectionName
                    var SectionID = mys.querySection[i].SectionID
                    str = '<li class="closed" id="SectionID' + SectionID + '"><img src="/Content/image/folder-closed.gif"/> ' + SectionName + '<ul class="browser1" id="browser' + SectionID + '" value="' + SectionID + '"></ul></li>'
                    $("#browser").append(str);
                }
                //病区
                $("#browser").treeview();
                for (var i = 0; i < mys.queryInpatientWard.length; i++) {
                    var SectionId = ("browser" + mys.queryInpatientWard[i].SectionID)
                    var InpatientWardName = mys.queryInpatientWard[i].InpatientWardName
                    var InpatientWardID = mys.queryInpatientWard[i].InpatientWardID

                    str = '<li class="closed" id="InpatientWardsID' + InpatientWardID + '"><img src="/Content/image/file.gif" />' + InpatientWardName + '<ul id="folder21" class="browsers' + InpatientWardID + '"></ul></li>'
                    $("#" + SectionId).append(str);
                }
                $(".browser1").treeview();
                //病床
                for (var i = 0; i < mys.querySickbed.length; i++) {
                    var SectionIds = ("browsers" + mys.querySickbed[i].InpatientWardID)
                    var tb = mys.querySickbed[i]

                    str = '<li class="cursors" id="SickbedID' + tb.SickbedID + '" onclick="buttons(' + tb.SickbedID + ')">' + tb.p_PatientName + ' (' + tb.SickbedNum + '床) ' + tb.H_ADNum + '</li>'

                    $("." + SectionIds).append(str);
                }
                $("#folder21").treeview();
            });
        }
    </script>

这里的技术难点并不多，主要是要理解他们之间的关系，然后在父元素的标签上给一个子元素用的表的外键，只要可以查到就行了

<script type="text/javascript">
        $(function () {
            $("#browser").treeview();
            aTexts()
        });

        function aTexts() {
            var searchText = $("#searchText").val();
            // $.ajaxSettings.async = false;//改为同步传输
            $.post("/AdmissionInformation/PatientInformation/Query", { searchText: searchText }, function (mys) {
                //科室
                $("#browser").empty();
                for (var i = 0; i < mys.querySection.length; i++) {
                    var SectionName = mys.querySection[i].SectionName
                    var SectionID = mys.querySection[i].SectionID
                    str = '<li class="closed" id="SectionID' + SectionID + '"><img src="/Content/image/folder-closed.gif"/> ' + SectionName + '<ul class="browser1" id="browser' + SectionID + '" value="' + SectionID + '"></ul></li>'
                    $("#browser").append(str);
                }
                //病区
                $("#browser").treeview();
                for (var i = 0; i < mys.queryInpatientWard.length; i++) {
                    var SectionId = ("browser" + mys.queryInpatientWard[i].SectionID)
                    var InpatientWardName = mys.queryInpatientWard[i].InpatientWardName
                    var InpatientWardID = mys.queryInpatientWard[i].InpatientWardID

                    str = '<li class="closed" id="InpatientWardsID' + InpatientWardID + '"><img src="/Content/image/file.gif" />' + InpatientWardName + '<ul id="folder21" class="browsers' + InpatientWardID + '"></ul></li>'
                    $("#" + SectionId).append(str);
                }
                $(".browser1").treeview();
                //病床
                for (var i = 0; i < mys.querySickbed.length; i++) {
                    var SectionIds = ("browsers" + mys.querySickbed[i].InpatientWardID)
                    var tb = mys.querySickbed[i]

                    str = '<li class="cursors" id="SickbedID' + tb.SickbedID + '" οnclick="buttons(' + tb.SickbedID + ')">' + tb.p_PatientName + ' (' + tb.SickbedNum + '床) ' + tb.H_ADNum + '</li>'

                    $("." + SectionIds).append(str);
                }
                $("#folder21").treeview();
            });
        }
    </script>