– How to use ? : if statements with Razor and inline code blocks

The Question :

156 people think this question is useful

I’m updating my old .aspx views with the new Razore view engine. I have a bunch of places where I have code like this:

<span class="vote-up<%= puzzle.UserVote == VoteType.Up ? "-selected" : "" %>">Vote Up</span>

Ideally I’d like to do this:

<span class="vote-up@{puzzle.UserVote == VoteType.Up ? "-selected" : ""}">Vote Up</span>

However there’s two problems here:

  1. vote-up@{puzzle.UserVote …. is not treating the @ symbol as a start of a code block
  2. @puzzle.UserVote == VoteType.Up looks at the first part @puzzle.UserVote as if it’s supposed to render the value of the variable.

Anyone know how to address these issues?

The Question Comments :
  • I haven’t used Razor but based on what I’m seeing, try @(puzzle.UserVote == VoteType.Up ? "-selected" : "")
  • As this is the top result for inline ternary operators in razor, I’ll add that if your output contains html or encodable characters such as apostrophes, e.g. @(isSomething ? "class='test'" : "") for example injecting javascript or similar, it will encode them as entities like &#39; and break the page. So you must use Html.Raw(".."). Otherwise with the above code you’d end up with something like <p class=&#39;test&#39;> which is invalid.

The Answer 1

304 people think this answer is useful

This should work:

<span class="vote-up@(puzzle.UserVote == VoteType.Up ? "-selected" : "")">Vote Up</span>

The Answer 2

32 people think this answer is useful

The key is to encapsulate the expression in parentheses after the @ delimiter. You can make any compound expression work this way.

The Answer 3

29 people think this answer is useful
@( condition ? "true" : "false" )

The Answer 4

6 people think this answer is useful

In most cases the solution of CD.. will work perfectly fine. However I had a bit more twisted situation:

 @(String.IsNullOrEmpty(Model.MaidenName) ? "&amp;nbsp;" : Model.MaidenName)

This would print me “&nbsp;” in my page, respectively generate the source &amp;nbsp;. Now there is a function Html.Raw("&nbsp;") which is supposed to let you write source code, except in this constellation it throws a compiler error:

Compiler Error Message: CS0173: Type of conditional expression cannot be determined because there is no implicit conversion between ‘System.Web.IHtmlString’ and ‘string’

So I ended up writing a statement like the following, which is less nice but works even in my case:

@if (String.IsNullOrEmpty(Model.MaidenName)) { @Html.Raw("&amp;nbsp;") } else { @Model.MaidenName } 

Note: interesting thing is, once you are inside the curly brace, you have to restart a Razor block.

Add a Comment