Question

我有@model IEnumerable<HotelWithRating> - 一些酒店。在视图中，我有5个复选框 - 酒店的星星。

<table>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
        <td>5</td>
    </tr>
    <tr>
        <td><input type = 'checkbox' value="false" id= '1' onclick = ' ShowHotels();'/></td>
        <td><input type = 'checkbox' value="false" id= '2' onclick = ' ShowHotels();'/></td>
        <td><input type = 'checkbox' value="false" id= '3' onclick = ' ShowHotels();'/></td>
        <td><input type = 'checkbox' value="false" id= '4' onclick = ' ShowHotels();'/></td>
        <td><input type = 'checkbox' value="false" id= '5' onclick = ' ShowHotels();'/></td>
    </tr>
</table>

我需要显示的酒店例如有5星或4星（如果选中了第四个和第五个复选框）。

它应该是这样的

<table class="Grid"> 
    <tr> 
        <th>Name</th>
        <th>Stars</th>       
        <th>Rating</th>
        <th>Description</th>             
    </tr> 
    <script type="text/javascript">
        function ShowHotels() 
        {
              @foreach (var item in Model)
                  {
                      <text>
                      if (document.getElementById(item.Hotel.stars).checked == true)
                      {
                          <tr>
                          <td>@item.Hotel.Name</td>
                          <td>@item.Hotel.Stars</td>
                          <td>@item.Rating</td>
                          <td>@item.Hotel.Description</td>
                          </tr>
                      }
                      </text>
                  }
        }
    </script>
</table>

我找到了许多关于将javascript与代码混合但仍未做出决定的主题。

Answer 1

最好先根据复选框选择过滤模型。它可以通过比较模型中每个酒店的属性在客户端完成。否则你也可以使用AJAX进行服务器端过滤（发送所选复选框的信息然后服务器会发送过滤后的模型）。服务器端过滤更好的是你有大量的酒店列表需要研究。

然后将此过滤后的模型分配给网格，或者使用JavaScript为过滤模型中的每个元素使用for循环生成表。

如果你得到，请随意提出任何进一步的问题。感谢。

混合javascript和C＃

1 个答案: