Question

I am new to razor engine syntax and I have issue with formatting adding the logic in the view. Here is what I want to accomplish. I have collection of items coming from model.
I need to iterate that collection and align 6 item in a row.

This is how the final output should look like:

<table>
   <tr>   
     <td>checkbox comes here</td>
     <td>checkbox comes here</td>
     <td>checkbox comes here</td>
   </tr>   
   <tr>   
     <td>checkbox comes here</td>
     <td>checkbox comes here</td>
     <td>checkbox comes here</td>
   </tr>   
    ................. and so on
</table>

Here is the code I wrote in the view

 <table>
     @for (int i = 0; i <= Model.checkItems.Count; i++)
     {
          if (i % 6 == 0)
          { <tr> }

               <td>
                 <input type="checkbox" 
                    id="chk_@(Model.checkItems[i].DisplayText)"
                    name="chk"
                    nameVal = "@Model.checkItems[i].DisplayText"
                    value="@Model.checkItems[i].Value"/>

                 <label for="chkGroup_@(Model.checkItems[i].DisplayText)">@Model.checkItems[i].DisplayText
               </td>                        

           if(i % 6 == 0) 
           { </tr> }

       }                    
</table>

When the page finally gets rendered, the first if condition getting executed but not the second one.
Can somebody help to figure out how the accomplish this?

Answer 1

Try this

<table>
@{    int count = 0; } 
<tr>
@foreach (var item in Model.checkItems)
{
   <td>
       <input type="checkbox" 
                id="chk_@(item.DisplayText)"
                name="chk"
                nameVal = "@item.DisplayText"
                value="@item.Value"/>
       <label for="chkGroup_@(item.DisplayText)">@item.DisplayText</label>
   </td>
    if (++count % 6 == 0)
    {
        @:</tr><tr>
    }    
} 
</tr>
</table>