筛选数据的类型

                 筛选数据的类型

开发工具与关键技术：MVC  专题技术
作者：彭春怡
撰写时间：2019/7/7

各位IT界的朋友好，今天我给大家介绍的是筛选数据的类型。通过数据的不同类型进行筛选。如：我今天要介绍的房台类型筛选，这个房台类型筛选呢是通过它的状态进行筛选的，通过它不同的状态进行筛选。这个房台的状态呢是分为可用台、已用台、停用台、预定台，那么我们就要以不同的状态类型进行筛选。简单的说呢就是筛选不同的房台状态类型，然后再进行追加。这就是我今天要给大家介绍的内容。如有不对的地方，请多多指教。下面让我们来认识我们的筛选方法吧。

视图样式代码：

 可 用 台 

这个样式代码呢就相当于筛选模态框的按钮。这个按钮呢是可用台的按钮。只要获取它的id便可。

视图方法代码：

$("#xdfgvcv").click(function () {
首先写的是一个点击事件，click就是点击事件的意思。获取“label”里面的的id，给它一个点击事件。就是制作一个按钮。

    $.post("platform",  function (data) {
          $("#colData").empty();

然后一个“post”方法，接收控制器转过来的数据连接“platform”，platfor连接呢是已经简写了，总结把它的方法命名写过来，这样比较简洁，不会太容易出错，因为连接太长了，容易出错。
然后就是一个清空文本框“$("#colData").empty();”，“colData 是获取存放房台图的盒子id”，这个清空文本框，是清空除了通过状态类型查询出来的数据以外的数据。

            $.each(data, function (i) {
                var StationState = data[i].StationState;
                if (StationState == "可用台")
                $("#colData").append("<div class='goor' style='float:left; width:200px; height:200px; border-radius:8px; margin-left:10px; margin-top:10px; background-color:green; font-size:30px;text-align:center; color:white;' id=''>"
                  + data[i].RoomPlatformNumber + "<P>"
                  + data[i].RoomPlatformName + "</P>"
                  + "</div><ul class='dropdown-menu' role='menu' id="
                  + data[i]["RoomPlatformID"] + "></ul>")
                            })
                     })
    });

然后到“each”方法，相当于一个循环的方法，就是将可用的房台进行循环出来。 获取数据的量“data”。直接声明房台的状态，获取它的数量。判断它是否可用房台。如是可用太，点击按钮时便显示出再存在房台图的盒子上。
然后下面时应该追加方法，获取存放法国太图的盒子进行追加。然后房台图的样式，直接写再追加方法上，再获取房台图的ID，筛选出它的房台名与房台号，这样再房台图上会显示房台图的房台名与房台号，就如下面功能实现图的样式。“B007”房台号，“风之房”房台名。

功能的实现图1：

点击绿色按钮就会显示全部可用的房台。
总结：房台中还有其它的，已用台、停用台、预定台写法时一样的，这里呢我就只用可用台，给大家做一个解释，筛选数据的功能就是这样完成的。如有不对的地方请多多指教。