ASP.Net Application Browser Compatibility


Information
Simple code snippet to improve ASP.NET Browser Compatibility, in particular: Chrome/Safari

Proper detection of the Web Browsers type and capabilities is rather important from the end-users and developers prospective as well. Modern Web-based "thin client" applications are essentially Platform/OS independent as the Browsers are gradually becoming de facto a “virtual” OS for online applications. The differences between Browsers, rooted in branding/versioning create the serious Browser compatibility issues, which could cause some Web applications to run incorrectly. As an example, see the Demo screen shot demonstrating the ASP.NET Horizontal Menu control compatibility issue with Google Chrome/Safari Web Browsers. Simple code snippet could be added to ASP.NET web applications in order to resolve this issue by setting the value of Page.ClientTarget = "uplevel" as shown below.

Working DEMO app, compatible with all major Browsers (IE/Firefox/Safari/Chrome) is available at: http://www.webinfocentral.com
MORE READING:
  1. How to select web browser and check its capabilities
  2. How to archive and back-up your online content
  3. Computer mouse triple-click is a convenient feature

Project contains:

1. Class Module "BrowserUpLevel.cs" to be placed in AppCode directory (ASP.NET 2.0+)_
2. Default Web page "Default.aspx" and corresponding code behind page with code snippet as shown below

The core Browser detection functionality is encapsulated in class module "BrowserUpLevel.cs" shown below:

//******************************************************************************
// Module           :   BrowserUpLevel.cs
// Author           :   Alexander Bell
// Date Created     :   03/15/2008
// Last Modified    :   10/10/2009
// Description      :   Code to improve Browser compatibility

//******************************************************************************
// DISCLAIMER: This Application is provide on AS IS basis without any warranty
//******************************************************************************

using System;
using System.Web;

///*****************************************************************************
public static class BrowserCompatibility
{
    #region IsUplevel Browser property
    private enum UpLevel{chrome, firefox, safari }

    public static bool IsUplevel {
        get{
            bool ret = false;
            string _browser;

            try {

                if (HttpContext.Current == null) return ret;
                _browser = HttpContext.Current.Request.UserAgent.ToLower();

                foreach (UpLevel br in Enum.GetValues(typeof(UpLevel)))
                { if (_browser.Contains(br.ToString())) { ret = true; break; }}

                return ret;
            }
            catch { return ret; }
        }
    }
    #endregion
}
///*****************************************************************************

Sample code behind page contains code snippet to enforce "uplevel" Browser:

//******************************************************************************
// Module           :   Default.aspx.cs
// Description      :   code behind: set uplevel value to improve 
//                  :   ASP.NET Browser Compatibility
//******************************************************************************
// Author           :   Alexander Bell
// Company          :   Infosoft International Inc.
// DateCreated      :   03/11/2009
// Modified         :   10/14/2009
//******************************************************************************
// DISCLAIMER: This Application is provide on AS IS basis without any warranty
//******************************************************************************

using System;

public partial class _Default : System.Web.UI.Page
{
    #region Page Pre-Init: force uplevel browser setting
    protected void Page_PreInit(object sender, EventArgs e)
    {
        if (BrowserCompatibility.IsUplevel) 
        { 
            Page.ClientTarget = "uplevel"; 
        }
    }
    #endregion
}
//******************************************************************************

Sample screenshot demonstrates ASP.NET Menu Bar Browser Compatibility issue:

BrowserCompatibility.jpg
Fig.1. Sample screenshot using ASP.NET in Google Chrome Browser

0 comments:

Post a Comment

Subscribe to: Post Comments (Atom)