Why does Razor not like this?

Question

Ive got a mega annoying problem I have a view with:

@{

        if(ViewBag.Section == "Home")
        {
           <div id="headerfrontPage">   
        }
        else
        {
            <div id="header">   
        }


     }

And I get a compilation error:

The code block is missing a closing "}" character. Make sure you have a matching "}" character for all the "{" characters within this block, and that none of the "}" characters are being interpreted as markup.

How do I conditionally write a div? Its for a hack bascially...

Answer 1

You can use the same construct when you wrap your div's inside element like:

@if (ViewBag.Section == "Home")
{
    <text><div id="headerfrontPage"></text>
}
else
{
    <text><div id="header"></text>
}

Or you use razor syntax @: like

@if (ViewBag.Section == "Home")
{
    @:<div id="headerfrontPage">
}
else
{
    @:<div id="header">
}

But for your current situation I would prefer Ron Sijm's solution:

@{
var divName = ViewBag.Section == "Home" ? "headerfrontPage" : "header";
}

<div id="@divName"> 

Answer 2

I suspect it is because your divs are not closed, so razor assumes that the closing brace is actually part of the div content.

You might try outputting the entire div content within your code there, including the closing tag, or output the div tag with a Response.Write, or something similar, so there is no confusing markup.

EDIT: also, maybe enclosing your div tag in a

<text></text>

might be worth a try.

Answer 3

You could try this:

@{
string divName;

    if(ViewBag.Section == "Home")
    {
       divName = "headerfrontPage";
    }
    else
    {
        divName = "header";
    }
}

<div id="@divName"> 

I'm not sure if that will help, it a long shot. But at least imo that looks better...

Answer 4

Try this:

@if (ViewBag.Section == "Home")
{
    <text> <div id="headerfrontPage"> </text>
}
else
{
    <text> <div id="header"> </text>
}