[Solved] SelectedCssClass not working with ItemTemplate

[KDL]

The RadMenu is ignoring the SelectedCssClass property when using ItemTemplates. It is correctly applied if ItemTemplates are not used.

CSS:

        .TabFormat
        {
            height:50px !important;
            background-color:#263144 !important;
            padding:0px;
        }
        .TabFormat:hover
        {
            background-color:#212631 !important;
            color:#f78f1e;
        }
        .TabSelected
        {
            background-color:#212631 !important;
            color:#f78f1e !important;
        }
        .NavMenuItem
        {
            width:150px;
            height:50px;
        }
        .NavMenuItem a, a:hover, a:active
        {
            cursor:default;
            text-decoration:none;
            color:#f78f1e;
        }
        .NavMenuTitle
        {
            font-size:12pt;
            padding:5px 0px 5px 15px;
        }
        .NavMenuSubTitle
        {
            padding-left:15px;
            font-size:8pt;
        }

Markup:

                <telerik:RadMenuItem IsSeparator="true" />
                <telerik:RadMenuItem runat="server"
                    Text="how it works"
                    CssClass="TabFormat"
                    SelectedCssClass="TabSelected"
                    NavigateUrl="~/HowItWorks.aspx"
                    >
                    <ItemTemplate>
                        <a href="../HowItWorks.aspx">
                            <div class="NavMenuItem">
                                <div class="NavMenuTitle">
                                    How it works
                                </div>
                                <div class="NavMenuSubTitle">
                                    we'll show you
                                </div>
                            </div>
                        </a>
                    </ItemTemplate>
                </telerik:RadMenuItem>

Codebehind (VB) with work-around:

        Dim currentItem As RadMenuItem
        If Request.Url.PathAndQuery.Contains("/products/") Then
            currentItem = RadMenu1.FindItemByText("products")
        Else
            currentItem = RadMenu1.FindItemByUrl(Request.Url.PathAndQuery)
        End If
        If Not IsNothing(currentItem) Then
            currentItem.Selected = True

            ' NOTE: This is a workaround to a bug in the RadMenu that fails to apply the "selectedCSS"
            '       when using Templates.
            currentItem.CssClass = "TabSelected"
        End If

[Yana]

Hello,

For now templated items cannot be selected and their SelectedCssClass is not rendered, this issue is already logged and will be fixed.

Sincerely yours,
Yana
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[KDL]

Well I'm glad to know it wasn't just me missing something obvious. But then again, I can't get back the 2 hours of my life spent troubleshooting this issue.

How about some points for identifying the issue and providing a workaround? ;-)

[Yana]

Hello,

I'm sorry I missed that. Please find your points updated.

Kind regards,
Yana
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.