使用asp.net MVC在单个页面上显示块和地板以及房间

时间:2018-10-05 11:57:29

标签: c#-4.0

我是asp.net MVC的初学者  我的数据库中有tblBlock,tblFloor,tblRoom表。我想在一个页面中显示所有这些内容,例如当我单击“区号”时,它应该显示楼层列表,而当我单击楼层号时,它应该显示房间数量。如何在asp.net MVC的单个页面中执行此操作。

这是我的查看代码



    function GetFloors() {

        $("#tblFloor tbody tr").remove();
        console.log("Hello Javascript");
            $.ajax({
                type: "GET",
                //url: "/RoomBooking/GetFloors",
                url: '@Url.Action("GetFloors","RoomBooking")',
                dataType: "json",
                //cache: false,
                async: "false",
                contenttype:"charset=utf-8",
                success: function (data) {

                    $.each(data, function (i, item) {
                        var rows = ""
                        + ""
                                  + ' tblFloor  ' + item.Floor_No + ""

                        + "";
                        $('#tblFloor tbody').append(rows);

                    });
                },


            });
            //Prevent default behavior
            return false;
        }


这是我的控制人

    [HttpGet]
    public JsonResult GetFloors()
    {
        List<tblFloor> floors = new List<tblFloor>();

        floors = BlockRepsitory.GetFloors(1).ToList();

         return Json(floors, JsonRequestBehavior.AllowGet);
    }

1 个答案:

答案 0 :(得分:0)

最后,我得到了一个解决方案,下面是该解决方案的代码:

 <script>
        $(document).ready(function () {
            loadData();
        });

    function loadData() {

            $.ajax({
                url: "/PeopleBooking/Blocklist",

                type: "GET",
                contentType: "application/json;charset=utf-8",
                dataType: "json",
                success: function (result) {
                    var html = '';
                    $.each(result, function (key, item) {
                        html += '<div class="col-md-3 col-lg-3 col-xl-2 "><a href="#"onclick="return getbyID(' + item.Block_id + ')"><section class="panel panel-featured-left panel-featured-primary "><div class="panel-body zoom"><div class="widget-summary"><div class="widget-summary-col widget-summary-col-icon"><div class="summary-icon bg-white"><img src="/assets/images/RoomImg/block.png" width = "150" height = "150" class="img-circle img-responsive"/></div></div><div class="widget-summary-col"><div class="summary"><h4 class="title">' + item.Block_name + '</h4><div class="info"><strong class="amount">' + item.Block_No + '</strong></div></div></div></div></div></div></section></a></div>';
                    });
                    $('#yes').html(html);
                },
                error: function (errormessage) {
                    alert(errormessage.responseText);
                }
            });
        }
</script>