Dao động Xem các hàng của bảng động

Question

Tôi muốn có một bảng trong quan điểm của mình sẽ đặt 3 phần tử từ Mô hình của tôi vào mỗi hàng. Vì vậy, cách tôi sẽ làm điều này là để lặp qua các mô hình và bên trong vòng lặp foreach làm một kiểm tra trên một biến đếm tôi đã thiết lập. Nếu đếm mod 3 == 0 tôi sẽ làm một cái gì đó như </tr><tr> để bắt đầu một hàng mới. Điều này không hoạt động theo cách tôi muốn vì tôi sẽ có một số } theo sau <tr>. Vì vậy, về cơ bản câu hỏi của tôi là, làm thế nào tôi sẽ tạo ra một bảng năng động bên trong của một cái nhìn dao cạo dựa trên các yếu tố trong mô hình mà mỗi hàng có 3 mặt hàng?

@{ 
int count = 0; 
<div> 
<table> 
<tr> 
@foreach (var drawing in Model) 
{ 
    <td style="width:240px;margin-left:30px; margin-right:30px;"> 
    <img src="@Url.Action("GetImage", "Home", new { id = drawing.drw_ID })" alt="drawing" /> 
    </td> 
    count++; 
    if(count%3==0) 
    { 
     </tr> 
     <tr> 
    } 
} 
</tr> 
</table> 
</div> 
} 

Có lẽ có một cách dễ dàng hơn nhiều để làm điều này mà tôi không nghĩ đến việc

Answer 1

Làm thế nào về việc sử dụng hai vòng - điều này sẽ làm cho tài liệu của bạn được thiết lập nhiều độc đáo hơn và làm cho nó dễ đọc hơn một chút . Ngoài ra, nó sẽ chăm sóc những vấn đề xảy ra nếu số hàng là không chia hết cho ba:

<div> 
<table> 
@for(int i = 0; i <= (Model.Count - 1)/3; ++i) { 
    <tr> 
    for(int j = 0; j < 3 && i + j < Model.Count; ++j) { 
    <td style="width:240px;margin-left:30px; margin-right:30px;"> 
     <img src="@Url.Action("GetImage", "Home", new { id = Model[i + j].drw_ID })" alt="drawing" /> 
    </td> 
    } 
    </tr> 
} 
</table> 
</div> 

Edited để phản ánh đang dán của bạn. Lưu ý, điều này giả định mô hình thực hiện IList hoặc một mảng

Answer 2

Maybee này là giải pháp bạn đang tìm kiếm công trình đối với tôi

@{ 
int count = 0; 
** 
var tr = new HtmlString("<tr>"); 
var trclose = new HtmlString("</tr>"); 
** 
<div> 
<table> 
<tr> 
@foreach (var drawing in Model) 
{ 
    <td style="width:240px;margin-left:30px; margin-right:30px;"> 
    <img src="@Url.Action("GetImage", "Home", new { id = drawing.drw_ID })" alt="drawing" /> 
    </td> 
    count++; 

    if(count%3==0) 
    { 
    ** 
    trclose 
    tr 
    ** 
    } 
} 
</tr> 
</table> 
</div> 
} 

Answer 3

Kiểm tra này ra, điều này sẽ làm việc cho bạn !!!

<h2>Index</h2> 
<table> 
    <tr> 
     @{ 
      var index = 0; 
     } 

     @foreach (int num in Model) 
     { 
      if ((index % 10) == 0) 
      { 
      @Html.Raw("</tr>"); 
      @Html.Raw("<tr>"); 


      } 
      <td> 
       <h2>@num</h2> 
      </td> 
      index++; 
     } 
    </tr> 
</table> 

Answer 4

Giải pháp @christian làm việc cho tôi.Tôi không chắc chắn về "trclose" và "tr" vì đăng ở đây là giải pháp mà làm việc cho tôi theo quan điểm của dao cạo.

<table> 
     <tr><td><input type="checkbox" id="chkAssetCategories" />&nbsp;SELECT ALL</td></tr> 
     <tr> 
     @{ 
      var count=0; 
      foreach (var item in Model.AssetCategories) 
       { 
        <td><input type="checkbox" class = "Catgories" id='@item.ID' value ='@item.ID' /><label>@item.Name</label></td> 
        if (count%5 == 0) 
        { 
         @:</tr><tr> 
        } 
        count++; 
       } 
     } 
     </table> 

Answer 5

@{ int counter = 0;} 
<div> 
    <table> 
     @for(int i = 0; i <= (Model.Count - 1)/3; ++i) { 
      <tr> 
       for(int j = 0; j < 3; ++j) { 
         <td style="width:240px;margin-left:30px; margin-right:30px;"> 
          @Model[counter] 
         </td> 
         counter++; 
       } 
      </tr> 
     } 
    </table> 
</div>