razor if statement counter issue v74 - Razor

Press Ctrl / CMD + C to copy this to your clipboard.

Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at

Chris Clancy 63 posts 132 karma points

Mar 11, 2016 @ 14:31

Razor if statement counter issue v7.4

Razor

Umbraco 7

Hi,

I'm new to Razor and trying to carry out what should be a simple task but my code is not working. I am displaying the results of a query (in a partial) and within that query I have set up a counter so that I can wrap different HTML around the items, depending which number they are.

So, it looks like this:

@inherits Umbraco.Web.Mvc.UmbracoTemplatePage


@{ var selection = CurrentPage.Site().FirstChild("articleRepo").Children("article").Where("Visible").OrderBy("CreateDate desc").Take(10); }

@if (selection.Any())
{
    var n = 0;
    <div>

        @foreach (var item in selection)
        {
            var imagePath = @item.image640;
            n++;

            if(n==1){
            do one things
            } else {
            do another
            }

            <div class="col-sm-6 hp-two-story">
                @n<img class="lazy" data-original="@("http://www.website.org" + imagePath)" />
                <p><a href="@item.Url">@item.Name</a></p>
            </div>
        }
    </div>
}

The content shows just fine until I put the..

      if(n==1){
        do one things
        } else {
        do another
       }

Then it throws errors. I msut have tried 100 variations of this, but I'm close to going insane. I get the same errors whether using Back OFfice or VS.

Copy Link

Chris Clancy 63 posts 132 karma points

Mar 11, 2016 @ 14:38

Howver, if I do this:

@foreach (var item in selection)
{
   var imagePath = @item.image640;
    n++;


    <div class="col-sm-6 hp-two-story">
        @if (n == 1) { 
            <p>Do one thing</p>
        }
        else
        {
            <p>Do another</p>
        }
        @n<img class="lazy" data-original="@("http://website.org" + imagePath)" />
        <p><a href="@item.Url">@item.Name</a></p>
    </div>
}

I don;t get any errors.

The Razor is fussy about being before/after HTML tags?

I don't get it.

Copy Link

Dennis Adolfi 1082 posts 6446 karma points MVP 5x c-trib

Mar 11, 2016 @ 14:49

0

Yes, it can be a bit confusing when your new to Razor with before/after HTML tags. Generally if you are inside a HTML tag, it sholud be a @ before the statement, and if its inside another statment (if statement inside an foreach) then it should not have a starting @.

Copy Link
Jay Criscione 16 posts 105 karma points

Mar 11, 2016 @ 15:15

0

are you asking about outputting formatted text inside the if...else statement?

You will probably either want to use the <text>block</text> or @Html.Raw("output string") depending on your needs.

Copy Link

Chris Clancy 63 posts 132 karma points

Mar 11, 2016 @ 15:50

OK I got it to work using this code:

@{ var selection = CurrentPage.Site().FirstChild("articleRepo").Children("article").Where("Visible").OrderBy("CreateDate desc").Take(12); }

@if (selection.Any())
{
    var n = 0;
    <text>

        @foreach (var item in selection)
        {
            n++;
            var cssClassNames = "";
            var imagePath = @item.imagePath640;

           <text>  
           @if (n == 1) {
               cssClassNames = "col-sm-12 hp-one-story";
           } else if (n > 1 && n < 4)  {
               cssClassNames = "col-sm-6 hp-two-story";
           }
           else 
           {
               cssClassNames = "col-sm-4 hp-three-story";
           }         
           </text>
            <div class="@cssClassNames">
                <a href="@item.Url">
                    <img class="lazy" data-original="@("http://website.org" + imagePath)" />
                </a>
                <p><a href="@item.Url">@item.Name</a></p>
            </div>
        }
    </text>
}

So is this a standard/good practice way to do it or have I just got lucky?

Copy Link

is working on a reply...

Please Sign in or register to post replies