CODEWITHSUNDEEP
c#razor
Christopher Northcutt
Christopher Northcutt

Reputation: 11

Razor C# foreach loop through image array

I'm trying to iterate through an array of images and have it go to the next row after theres 3 images in a row. I'm getting syntax errors with Razor telling me I don't need the "@" character at the if statement. However when I remove them it then tells me I'm missing a closing bracket. I don't see a missing bracket anywhere. Here is my code.

<!-- MATRIX -->
<div>
<table class="table table-responsive">
    <tr>

    @{
        int c = 0;
    }

    @foreach (var x in portifolioImages)
    {
        c++;
        <td><img src="@x.UmbracoFile" alt="@x.imageTitle" style="margin:0     auto;" /></td>
        @if (c == 3)
        {
            </tr><tr>
        }
    }

</tr>
</table>
</div>
<!-- END MATRIX -->

Upvotes: 0

Views: 596

Answers (1)

Shyju
Shyju

Reputation: 218812

This line

@if (c == 3)
{
 </tr><tr >
}

</tr><tr > is not C# code. So you need to tell razor to treat it as HTML. You can do that by prefixing @: . Also you do not need @ in front of if as you are already in code block(inside the foreach).

if (c == 3)
{
  @:</tr><tr >
}

But this code will still produce an open tr tag when your item count is 3. So may be you should move that part(opening the tr) to another if condition. This code should work perfectly fine.

<table>
    @{ var counter = 1; }

    @foreach (var item in Model.Events)
    {
        if (counter==1)
        {
            @:<tr>
        }
        <td>Your content</td>
        if (counter % 3 == 0)
        {
          @:</tr>
          counter = 1;
        }
        counter++;
   }     
</table>

Upvotes: 2

Related Questions