Razor code with if/then/else - strange artifacts

Hello-

I'm having a bit of weirdness that I can't figure out.
I need one of you MVC gurus to shed some light on this before I pull all my hair out...

It was necessary for me to create a copy of the /Views/Shared/_ColumnsTwo.cshtml in order to use a particular plugin and achieve the layout we wanted without affecting other pages of our site. It is almost identical to the original and named "_ColumnsTwoArticles.cshtml"

Today, in my _ColumnsTwoArticles.cshtml I added the following code, which is working as I hoped..except for one thing... 2 inexplicable characters appear on my page, right where side-2 ends and center-2 begins...just above the breadcrumb.

<div class="side-2">
    @if (IsSectionDefined("left"))
    {
string theleftdiv="";
string currentpage=HttpContext.Current.Request.ServerVariables["PATH_INFO"];
if (currentpage == "/Articles/" | currentpage == "/articles/")
{
  theleftdiv ="<div class=\"articles-home-left-column\">";
}
else
{
  theleftdiv ="<div class=\"articles-list-left-column\">";
}
        @Html.Raw(theleftdiv)
        @RenderSection("left")
    }
    else
    {
        @Html.Widget("left_side_column_before")
        @Html.Action("CategoryNavigation", "Catalog", new { currentCategoryId = currentCategoryId, currentProductId = currentProductId })
        @Html.Widget("left_side_column_after_category_navigation")
        @Html.Action("ManufacturerNavigation", "Catalog", new { currentManufacturerId = currentManufacturerId })
        @Html.Action("VendorNavigation", "Catalog")
        @Html.Action("NewsletterBox", "Newsletter")
        @Html.Widget("left_side_column_after")
    }

The image below shows the two characters..one looks like a "square", and the other is a right-brace.


I tried pasting the "square" character into Google and searching..Google thought it was a question mark (?)
Articles.cshtml and the page that references it, and I can't see any reason for it.

Can you guys see a reason for it?

Thanks!

You did wrong on OR operator, || should be OR operator , Not |

Like

if (currentpage == "/Articles/" || currentpage == "/articles/")
{
  theleftdiv ="<div class=\"articles-home-left-column\">";
}

Try==>

@if (IsSectionDefined("left"))
{
    string theleftdiv = "";
    string currentpage = HttpContext.Current.Request.ServerVariables["PATH_INFO"];
    if (currentpage == "/Articles/" || currentpage == "/articles/")
    {
        theleftdiv = "<div class=\"articles-home-left-column\">";
    }
    else
    {
        theleftdiv = "<div class=\"articles-list-left-column\">";
    }
    @Html.Raw(theleftdiv)
    @RenderSection("left")
}
else
{
    @Html.Widget("left_side_column_before")
    @Html.Action("CategoryNavigation", "Catalog", new { currentCategoryId = currentCategoryId, currentProductId = currentProductId })
    @Html.Widget("left_side_column_after_category_navigation")
    @Html.Action("ManufacturerNavigation", "Catalog", new { currentManufacturerId = currentManufacturerId })
    @Html.Action("VendorNavigation", "Catalog")
    @Html.Action("NewsletterBox", "Newsletter")
    @Html.Widget("left_side_column_after")
}

Thanks Sohel, but still the 2 strange characters are appearing..

Here's what it looks like when I inspect the center-2 element:

embryo wrote:

It looks you have mistake another place which is content part ==>

<div class="center-2">
    @Html.Widget("main_column_before")
    @RenderBody()
    @Html.Widget("main_column_after")
</div>

Without go though your content page I can't tell where you did wrong

Note: if you want you can share your code with me, I will figure out

I know, right?? That's what I assumed, but no changes were made to anything except the bolded code above.
I even removed my new code and tried it again..no strange characters! I added back my new code and the characters appear again....

Hi,

With theleftdiv you open div element, where are you closing it? I suppose that is a problem.
Please note, you may do quick test: just replace div inside condition if and else, and add simple text to if ("I`m if") and to else ("I`m else"), than you will be able to test code. If it will display correctly, problem will be with your div element inside.

Regards,
Tomasz

embryo wrote:

@Thanks Tomasz, Yes you have to close  div html tag. make sure it.

Okay, thanks guys.
I do close the div, but back on the parent view which called the _ColumnsTwoArticles.cshtml...at the bottom of the section left:

@section left {
    @Html.Action("ArticleGroupNavigation", "ArticleRead",new { currentGroupId = currentGroupId, currentArticleId = currentArticleId })
    @Html.Widget("left_side_column_after")    
    @Html.Widget("left_side_column_after_category_navigation")
</div>
}

I also tried to close it on the _ColumnsTwoArticles.cshtml:

    @if (IsSectionDefined("left"))
    {
string theleftdiv="";
string currentpage=HttpContext.Current.Request.ServerVariables["PATH_INFO"];
if (currentpage == "/Articles/" || currentpage == "/articles/")
{
  theleftdiv ="<div class=\"articles-home-left-column\">";
}
else
{
  theleftdiv ="<div class=\"articles-list-left-column\">";
}
        @Html.Raw(theleftdiv)
        @RenderSection("left")
       </div>
}

..but that gives an error about no matching start div tag..

I changed my code...I removed the close div from the parent view and moved it to _ColumnsTwoArticles.cshtml like this:

<div class="side-2">
    @if (IsSectionDefined("left"))
    {
string theleftdiv="";
string thedivclose="</div>";
string currentpage=HttpContext.Current.Request.ServerVariables["PATH_INFO"];
if (currentpage == "/Articles/" || currentpage == "/articles/")
{
  theleftdiv ="<div class=\"articles-home-left-column\">";
}
else
{
  theleftdiv ="<div class=\"articles-list-left-column\">";
}
@Html.Raw(theleftdiv)
        @RenderSection("left")
@Html.Raw(thedivclose)
}
    else
    {
        @Html.Widget("left_side_column_before")
        @Html.Action("CategoryNavigation", "Catalog", new { currentCategoryId = currentCategoryId, currentProductId = currentProductId })
        @Html.Widget("left_side_column_after_category_navigation")
        @Html.Action("ManufacturerNavigation", "Catalog", new { currentManufacturerId = currentManufacturerId })
        @Html.Action("VendorNavigation", "Catalog")
        @Html.Action("NewsletterBox", "Newsletter")
        @Html.Widget("left_side_column_after")
    }
</div>
<div class="center-2">
    @Html.Widget("main_column_before")
    @RenderBody()
    @Html.Widget("main_column_after")
</div>

...and now I only have the square symbol appearing....so, I'm still pulling my hair out!

I added your code to default theme of my local test environment, and it is not calling any error or square. I suppose it is not coming from that code.
Where it is showing there is widget zone. Comment it to be sure is not coming from any widget. You may also comment line by line to localize issue.