c# - JavaScript と C# の混合

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 つ星のホテルを表示する必要があります (4 番目と 5 番目のチェックボックスがオンになっている場合)。

それはこのようなものでなければなりません

<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 とコードの混合に関する多くのトピックを見つけましたが、まだ決定していません。