In Mvc 3 razor view what is the best way to conditionally render html based on Nulls in the model

Question

This is I am sure an easy question but I am having trouble figuring this out.

I want to do something like this....

 @(string.IsNullOrEmpty(Model.CustomerUrl) ? "" : <a href="@Model.CustomerUrl">Click me</a>) 

This snippet doesn't work.

The mixing of the html with the razor syntax and the inclusion of quotes in the attributes of the tags is making it hard to figure out.

I love razor except figuring out this kind of stuff is really tripping me up.

I would love to just not render the following at all if the CustomerUrl was null or empty...

<p class="customerLink links"><a href="@Model.CustomerUrl">@Model.CustomerName</a></p>

EDIT
This is still not working for me...thanks for the suggestion though.

My issue is that the above code is ALREADY in a Razor Code Block. Here is my actual code that I cannot figure out...

EDIT NUMBER TWO - THE following code is now working

    @if (Model.Count() > 0)
    {
        foreach (var partner in Model)
        {
            <li>
                @Html.ActionLink(@partner.CustomerName, "Details", "Customer", new { id = Customer.AID }, null)<br />
                @partner.Street<br />
//this is what i cannot figure out!!
                @if(!string.IsNullOrEmpty(partner.Phone))
                    {
                        @partner.Phone@:<br />
                    }
                @partner.Distance<br />
            </li>
        }
    }

I preceded the nested block (the if) with the @ symbol. Then the markup
I had to delimit with @: Then it worked.

It seems yesterday when I tried to use a nested razor code block I got a compiler error BECAUSE I preceded it with an @. So now I am more confused than ever.

In fact...if I tried to surround my @partner.Phone with quotes like this... "@partner.Phone"@:</ br> I get another compiler error. Razor is great when it works but when it doesn't it is very confusing.

Seth

Answer 1

Don't do an inline if.

@if(!string.IsNullOrEmpty(Model.CustomerUrl))
{
    <a href="@Model.CustomerUrl">Click me</a>
}

'Nuff Said

Answer 2

 @if (Model.Count() > 0)
 {

Presumably before this line you had html display, so to denote to razor you're using code, you need the @ symbol.

    foreach (var partner in Model)
    {

You're within a code block already, so the @ symbol wouldn't work here.

        <li>

By using an html tag, razor realizes you're displaying HTML again. All content within here is assumed to be HTML. If you want to tell Razor you have code within here, you need to use the @ symbol to denote the code.

            @if(!string.IsNullOrEmpty(partner.Phone))
            {
                @partner.Phone@:<br />
            }

This is correct because you need to tell Razor you're using code again. Note if this if was directly ABOVE your list tag, you wouldn't use the @ symbol here, because you don't use the @ symbol when you're already within code.

"@partner.Phone" doesn't work for the same reason

if(something)
    ""

wouldn't work in C#. You're creating an object within code without using it.

Hope that helps explain it.

Answer 3

One of the suggestions that you will find on the Internet regarding conditional output and View is that the two should not be mixed together. If there is something that you need to display based on some condition then you should create an HTML Helper. However, in order to answer your question what you could do (if you don't want to bother with a helper) is something like this:

@if (!String.IsNullOrWhitespace(Model.CustomerUrl))
{
    <p class="customerLink links">
        <a href="@Model.CustomerUrl">@Model.CustomerName</a>
    </p>
}