Press Ctrl / CMD + C to copy this to your clipboard.
This post will be reported to the moderators as potential spam to be looked at
I have the following code:
<li class="@(isActive ? "active" : "")"> <a href="@node.Url">@node.Name</a></li>
But this gives kinda dirty code since all other LI than the active on will get an empty class attribute.
I would solve it like this with XSLT:
<xsl:variable name="classes"> <xsl:if test="@id = $currentPage/@id"> <xsl:text>active </xsl:text> </xsl:if> <xsl:if test="position() = 1"> <xsl:text>first </xsl:text> </xsl:if> <xsl:if test="position() = last()"> <xsl:text>last </xsl:text> </xsl:if> </xsl:variable> <li> <xsl:if test="normalize-space($classes)"> <xsl:attribute name="class"> <xsl:value-of select="normalize-space($classes)" /> </xsl:attribute> </xsl:if> <a href="{umb:NiceUrl(@id)}"> <xsl:call-template name="pagename" /> </a> </li>
And how to I handle the multiple classes from the XSLT in the Razor example ?
I hope that anyone can answer my question ...
Just move the class="" into the if statement?
It doesn't really matter that it has an empty class, but you could just make your code a little uglier:
<li @(isActive ? "class=\"active\"" : "")> <a href="@node.Url">@node.Name</a></li>
Thanx alot guys.
You're right that it doesn't really matter, but it doesn't look nice with the empty class attributes.
How do I add a second class like 'first' or 'last' without overwriting the one 'active' currently assigned ?
I would just change it up a little bit then (untested):
@{ var cssClass = ""; if (isActive) { cssClass = "active"; } if (node.IsFirst()) { cssClass += " first"; } if (node.IsLast()) { cssClass += " last"; } var liClass = ""; if(cssClass != string.Empty) { liClass = string.Format("class=\"{0}\"", cssClass.Trim()); } } <li @Html.Raw(liClass)> <a href="@node.Url">@node.Name</a> </li>
A few notes: I do the "Trim()" there because a node can be first or last, but not active, so you would get class=" first" instead of class="first".
Because there is quotes in the string, Razor does automatic escaping, so we need to do Html.Raw to get the unescaped quotes back.
is working on a reply...
This forum is in read-only mode while we transition to the new forum.
You can continue this topic on the new forum by tapping the "Continue discussion" link below.
Continue discussion
Need a little razor help ...
I have the following code:
But this gives kinda dirty code since all other LI than the active on will get an empty class attribute.
I would solve it like this with XSLT:
And how to I handle the multiple classes from the XSLT in the Razor example ?
I hope that anyone can answer my question ...
Just move the class="" into the if statement?
It doesn't really matter that it has an empty class, but you could just make your code a little uglier:
Thanx alot guys.
You're right that it doesn't really matter, but it doesn't look nice with the empty class attributes.
How do I add a second class like 'first' or 'last' without overwriting the one 'active' currently assigned ?
I would just change it up a little bit then (untested):
@{var cssClass = ""; if (isActive) { cssClass = "active"; } if (node.IsFirst()) { cssClass += " first"; } if (node.IsLast()) { cssClass += " last"; } var liClass = ""; if(cssClass != string.Empty) { liClass = string.Format("class=\"{0}\"", cssClass.Trim()); } } <li @Html.Raw(liClass)> <a href="@node.Url">@node.Name</a> </li>
A few notes: I do the "Trim()" there because a node can be first or last, but not active, so you would get class=" first" instead of class="first".
Because there is quotes in the string, Razor does automatic escaping, so we need to do Html.Raw to get the unescaped quotes back.
is working on a reply...
This forum is in read-only mode while we transition to the new forum.
You can continue this topic on the new forum by tapping the "Continue discussion" link below.