[hwyckoff]

I figured it out, and it’s not really all that difficult.

In the html (or in my case, aspx):

   <nav>
       <div><a>☰ Menu</a></div>
       <asp:Literal ID="SitemapList" runat="server"></asp:Literal>
       </nav>

And in my scriptblock:

<script type="text/javascript">
        $(document).ready(function () {
            $('#NavigationMenu').smartmenus();

            $('#ToggleMenu').click(function () {
                $('#NavigationMenu').toggle();
            });
        });
    </script>

The default is the menu tag is visible and the menu is hidden until the menu tag is toggled.
A media query reverses it for tablets and desktops, so the toggle hidden and the menu always defaults as visible.

Default css is for mobile:

#ToggleMenu
{
    display: block;
}

#NavigationMenu
{
    display: none;
}

A media query is for anything larger than 40em.

@media (min-width: 40em)
{
    #ToggleMenu
    {
        display: none;
    }

    #NavigationMenu
    {
        display: block;
    }
}

It’s pretty stable to me and I haven’t managed to break it yet.

[hwyckoff]

And here’s an even better approach to supplying the UL in an asp.net webpage when you need to filter by active directory roles. I nested four levels of asp:repeaters together and worked out a server-side solution to remove empty UL tags (which cause “empty” menu boxes).

http://stackoverflow.com/questions/30084144/how-can-i-hide-empty-nested-repeaters/30108957#30108957

[hwyckoff]

I’m only providing some asp.net details for the sake of any future customer also using asp.net and experiencing the same issue as me.

I resolved this issue by doing a plan B. If I didn’t need security trimming, then I’d use an xslt transform of the sitemap (http://forums.asp.net/t/2047562.aspx?How+can+I+get+my+XSLT+file+to+read+the+web+sitemap+urls+so+they+are+resolved+for+client+). That method works perfectly because I ensure that the resulting UL is clean and has the correct ID and classname.

When I need security trimming by roles (as I do in this instance), I used an asp:repeater control. Unfortunately this takes me to only two levels. http://forums.asp.net/t/2047487.aspx?repeater+control+to+show+full+sitemap+with+all+child+nodes

By using either option, depending on your needs, you can use asp.net to produce a clean and rendered UL that isn’t littered with classes like the asp:Menu still does.

[hwyckoff]

Scratch the last post. After refreshing the website, the menu didn’t work.

Back to the drawing board.

[hwyckoff]

I finally figured something out. I’m sharing this in the off chance that there are any asp.net vb users who need to use an asp.menu control. Making a custom class (with Visual Studio) really isn’t that hard at all. I had just missed a very simple step at the very last.

http://stackoverflow.com/questions/30044028/how-can-i-override-the-asp-net-menu-so-that-it-doesnt-litter-the-rendered-ul-wi

[hwyckoff]

I already presented the code I used above, so there would be nothing else to show.

I know for a fact that the the javascript and classes the .net server dumps in the UL cannot be removed by jQuery because the .net server ensures that it’s the VERY LAST thing to process.

While I can get away with using an xml to ul approach on one website, there is another where I need to use the menu object because it does security trimming by role (and there’s over 25 roles at my internal site).

It’s all good (for now). It’s just a process of me figuring out how to override the asp.net menu to provide a clean UL on the server side.

The CSS Friendly Class Extender isn’t really css friendly because the demos I’ve seen don’t provide clean UL either.

[hwyckoff]

No difference.

Last night I discovered the possibility of making an asp:menu custom class extension that might provide cleaner rendering, but I haven’t encountered the critical detail of exactly how to do that.

Work in progress…

[hwyckoff]

Disregard. I figured out it was a coding error on my part. The menu was showing empty submenu because my repeater was giving it empty children.

Facepalm.

Well if anyone else reports this issue, this is a possible troubleshooting step: check the menu input.

[hwyckoff]

Thank you. This did the trick. This question is fully resolved.

[Author]

Posts