asp:Menu control does not work well in all browsers

12 Jun 2009 12:38 PM

AAaron123

I IE a menu item looks like:
Events Calendar

If I click it I get a dropdown list of other menu items.
Just like in Windows.

But in some browsers the menuitem looks like:
Events Calendar Expand Events Calendar

If I click it I get:

Events Calendar Events Locations ^Up One Level

Pretty ugly, I think.

Anything I can do about that?

I'm using the asp:Menu control.

Thanks

12 Jun 2009 12:42 PM

Gregory A. Beamer

"AAaron123" <aaaron***@roadrunner.com> wrote in news:ex3slq16JHA.1716

@TK2MSFTNGP03.phx.gbl:

Show quoteHide quote

> I IE a menu item looks like:
> Events Calendar
>
> If I click it I get a dropdown list of other menu items.
> Just like in Windows.
>
> But in some browsers the menuitem looks like:
> Events Calendar Expand Events Calendar
>
> If I click it I get:
>
> Events Calendar Events Locations ^Up One Level
>
> Pretty ugly, I think.
>
> Anything I can do about that?
>
> I'm using the asp:Menu control.

I would personally consider using the CSS Friendly adapters and writing CSS
to configure the menu rather than have the menu control output the ugly
tables.

This means you are "on your own", but there are plenty of menu scripts out
there you can use and it is fairly easy to find CSS that will work for you.

--
Gregory A. Beamer
MVP; MCP: +I, SE, SD, DBA

Twitter: @gbworld
Blog: http://gregorybeamer.spaces.live.com

******************************************

Show quoteHide quote

| Think outside the box! |
******************************************

12 Jun 2009 1:15 PM

Mark Rae [MVP]

"AAaron123" <aaaron***@roadrunner.com> wrote in message
news:ex3slq16JHA.1716@TK2MSFTNGP03.phx.gbl...

> Anything I can do about that?

In addition to Gregory's (correct, IMO) suggestion that you use the CSS
Friendly Adaptors version of the menu control (Google it...), you can use
the technique described here:
http://www.velocityreviews.com/forums/t386549-mac-and-aspnet-20.html to make
the asp:Menu webcontrol display properly in Safari / Chrome etc, and you can
use the technique described here:
http://weblogs.asp.net/bleroy/archive/2009/03/23/asp-menu-fix-for-ie8-problem-available.aspx
to make it display properly in IE8.

--
Mark Rae
ASP.NET MVP
http://www.markrae.net

12 Jun 2009 11:57 PM

AAaron123

Show quote Hide quote

"Mark Rae [MVP]" <mark@markNOSPAMrae.net> wrote in message
news:%23vfPd$16JHA.5780@TK2MSFTNGP04.phx.gbl...
> "AAaron123" <aaaron***@roadrunner.com> wrote in message
> news:ex3slq16JHA.1716@TK2MSFTNGP03.phx.gbl...
>
>> Anything I can do about that?
>
> In addition to Gregory's (correct, IMO) suggestion that you use the CSS
> Friendly Adaptors version of the menu control (Google it...), you can use
> the technique described here:
> http://www.velocityreviews.com/forums/t386549-mac-and-aspnet-20.html to
> make the asp:Menu webcontrol display properly in Safari / Chrome etc, and
> you can use the technique described here:

I created a PageEx class inheriting from System.Web.UI.Page and inserted
Private Sub Page_PreInit(ByVal sender As Object, ByVal e As
System.EventArgs) Handles Me.PreInit

If (Request.Browser.Browser.Contains("Safari")) Then

Me.ClientTarget = "uplevel"

End If

End Sub

And that fixed Safari. Is that need because asp.net has the wrong capability
for Safari?

Also, I searched the internet and only found references to Safari.

Do you know what to check for as far as other browsers that need "uplevel"?

I mean is FireFox and Chrome the strings that I should use in my "if"
ststement?

Are there others?

I expected to find such a list but did not.

Thank a lot. This was an easy fix.

Now I'll read more about Friendly Adaptors.

Show quoteHide quote

> http://weblogs.asp.net/bleroy/archive/2009/03/23/asp-menu-fix-for-ie8-problem-available.aspx
> to make it display properly in IE8.
>
>
> --
> Mark Rae
> ASP.NET MVP
> http://www.markrae.net

13 Jun 2009 12:11 AM

Mark Rae [MVP]

"AAaron123" <aaaron***@roadrunner.com> wrote in message
news:eCMSWm76JHA.5756@TK2MSFTNGP02.phx.gbl...

> And that fixed Safari. Is that need because asp.net has the wrong
> capability for Safari?

Yes - more specifically, the browscap definitions - Google it...

> I mean is FireFox and Chrome the strings that I should use in my "if"
> ststement?

FireFox should be fine - not sure about Chrome...

> Are there others?

Probably...

> Now I'll read more about Friendly Adaptors.

That will make all the "uplevel" problems disappear...

--
Mark Rae
ASP.NET MVP
http://www.markrae.net

16 Jun 2009 8:47 PM

AAaron123

> >
>> I mean is FireFox and Chrome the strings that I should use in my "if"
>> statement?
>
> FireFox should be fine - not sure about Chrome...
>

FYI Chrome reports: AppleMAC-Safari
like Safari does.

12 Jun 2009 8:53 PM

AAaron123

Before I make the suggested changes I'd like to clear up something else that
just occurred. Unless you think those changes will fix this too.

After some debugging the following is true.

In Sub Page_PreRender I do:

Response.Write("<script type='text/javascript'>")
Response.Write("</script>")

The source in the browsers looks like:

<script type='text/javascript'>var htmlStyle =
document.getElementsByTagName('html')[0].style;htmlStyle.scrollbarBaseColor
= 'black';</script>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
...

When I removed that code from Page_PreRender my asp:Menu's drop-downs became
white rectangles instead of a list of menu items.

So I guessed that maybe if the DOCTYPE is not the first line it is ignored
and removing the script line made it effective.

Does that sound correct??

So I removed the DOCTYPE line from my code and the drop-down menu list looks
OK (with or without the script line)

I guess the browser defaults to something different if there is no DOCTYPE.

What is the that default?

I'd be surprised if you ran across this before but do you have any idea what
might be happening?

Thanks

12 Jun 2009 9:09 PM

Mark Rae [MVP]

"AAaron123" <aaaron***@roadrunner.com> wrote in message
news:udpzi$56JHA.4404@TK2MSFTNGP04.phx.gbl...

> Response.Write("<script type='text/javascript'>")
> Response.Write("</script>")

Please don't use Response.Write to inject HTML or JavaScript into ASP.NET
pages. ASP.NET is object-oriented, not linear like ASP Classic, so you have
much less control over where the JavaScript ends up in the final markup.

The ClientScript classes are designed specifically for this:
http://www.google.co.uk/search?aq=f&sourceid=chrome&ie=UTF-8&q="ASP.NET"+ClientScript

--
Mark Rae
ASP.NET MVP
http://www.markrae.net

12 Jun 2009 9:34 PM

AAaron123

Since I posted I've changed to
Page.ClientScript.IsClientScriptBlockRegistered

but this problem is with the DOCTYPE ot asp:Menu

The script line simply masked that problem.

Thanks

Show quoteHide quote

"Mark Rae [MVP]" <mark@markNOSPAMrae.net> wrote in message
news:eQwqZI66JHA.1716@TK2MSFTNGP03.phx.gbl...
> "AAaron123" <aaaron***@roadrunner.com> wrote in message
> news:udpzi$56JHA.4404@TK2MSFTNGP04.phx.gbl...
>
>> Response.Write("<script type='text/javascript'>")
>> Response.Write("</script>")
>
> Please don't use Response.Write to inject HTML or JavaScript into ASP.NET
> pages. ASP.NET is object-oriented, not linear like ASP Classic, so you
> have much less control over where the JavaScript ends up in the final
> markup.
>
> The ClientScript classes are designed specifically for this:
> http://www.google.co.uk/search?aq=f&sourceid=chrome&ie=UTF-8&q="ASP.NET"+ClientScript
>
>
> --
> Mark Rae
> ASP.NET MVP
> http://www.markrae.net