Razor Ver las filas de la tabla dinámica

Question

Quiero tener una tabla en mi opinión que va a poner 3 elementos de mi modelo en cada fila. Así que la forma en que iba a hacer esto es recorrer el modelo y dentro del bucle foreach hacer una verificación en una variable de recuento que he configurado. Si cuenta mod 3 == 0, haría algo como </tr><tr> para comenzar una nueva fila. Esto no funciona de la manera que yo quiero porque tendría un } siguiendo el <tr>. Entonces, básicamente, mi pregunta es, ¿cómo crearía una tabla dinámica dentro de una vista de maquinilla de afeitar basada en los elementos del modelo donde cada fila tiene 3 elementos?

@{ 
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> 
} 

tal vez hay una manera mucho más fácil de hacer esto que no estoy pensando en

Answer 1

¿Cómo sobre el uso de dos bucles - esto hará que el documento sea de configuración mucho más agradable y que sea un poco más fácil de leer . Además, se ocupa de los problemas que se producen si el número de filas no es divisible por tres:

<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> 

Editado para reflejar su código pegado. Tenga en cuenta, esto supone el modelo implementa IList o una matriz

Answer 2

Maybee esta es la solución que busca trabajos para mí

@{ 
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

mira esto, esto debería funcionar para usted !!!

<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

La solución @christian trabajó para mí.yo no estaba segura de "trclose" y "tr" por lo tanto, publicar aquí la solución que funcionó para mí en vista de afeitar.

<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>