ThemeSelector with ImageControl

rpcasey001 · March 7th, 2009, 01:14 AM

I have changed the ThemeSelector control from chapter 2 to change when a ImageControl is clicked. I have the code working; however, I have to click the image twice, or click the image and navigate to another page to get the theme to change.

Does anyone know why I do not get the theme change on the first click?

--- Ryan

Code:

using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using RC.RPC_Group;
namespace RC.RPC_Group.UI.Controls
{
    public partial class ThemeSelector : System.Web.UI.UserControl
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            
        }
        protected void blueTheme_Box_Click(object sender, ImageClickEventArgs e)
        {
            string themeName = "blueMidnight";
            Globals.ThemesSelectorID = themeName;
        }
        protected void redTheme_Box_Click(object sender, ImageClickEventArgs e)
        {
            string themeName = "maroonBlood";
            Globals.ThemesSelectorID = themeName;
        }
        protected void goldTheme_Box_Click(object sender, ImageClickEventArgs e)
        {
            string themeName = "goldLabel";
            Globals.ThemesSelectorID = themeName;
        }
}
}

Lee Dumond · March 7th, 2009, 01:47 AM

This is because the theme gets selected on the server side, but is not applied until the next page is served.

If you want the theme to change immediately, you need to include functionality in the OnPreInit event handler of each page that checks if the control that caused the last postback is the ThemeSelector. You can do this by examining the Forms collection of the request. If it is, then you need to set the Theme of the page to the new theme that was selected.

The best way to include this functionality is to override the OnPreInit event in a base page that all site pages would inherit.

If you look at the BasePage.cs file in TheBeerHouse, it shows clearly how to do this.

rpcasey001 · March 7th, 2009, 01:52 AM

I did that I thougt. Below is my code for BasePage.cs

Code:

using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
namespace RC.RPC_Group.UI
{
    public class BasePage : System.Web.UI.Page
    {
        protected override void OnPreInit(EventArgs e)
        {
            string themeName = Globals.ThemesSelectorID;
            if (themeName.Length > 0)
            {
                    this.Theme = themeName;
            }
            base.OnPreInit(e);
        }
    }
}

rpcasey001 · March 7th, 2009, 02:02 AM

If I write the code like this, the this.theme is NULL?

Code:

    public class BasePage : System.Web.UI.Page
    {
        protected override void OnPreInit(EventArgs e)
        {
            string themeName = Globals.ThemesSelectorID;
            if (themeName.Length > 0)
            {
                this.Theme = this.Request.Form[themeName];
            }
            base.OnPreInit(e);
        }
    }

Lee Dumond · March 7th, 2009, 02:19 AM

Your original logic is flawed.

What you are doing in your ImageButton event handlers is setting Globals.ThemeSelectorID to the name of the current theme.

What you WANT to do is to set Globals.ThemeSelectorID to the ID of a control that will be available in the Request.Form collection. Then, you can get that control from Request.Form.

Since you are NOT setting Globals.ThemeSelectorIDto the ID of a control, then of course Request.Form[Globals.ThemeSelectorID] will always be a null.

rpcasey001 · March 7th, 2009, 03:29 AM

Ok, I changed my BasePage and ThemeSelector. ThemeSelector now sets Globals.ThemeSelectorID to the UniqueID of the ImageButton. However, this.Theme = this.Request.Form[id]; and this.Session and ["CurrentTheme"] = this.Theme; are still Null.

Do I need to change thos code since I am now using a ImageButton, not a drop down list?
if (this.Request.Form["__EVENTTARGET"] == id &&
!string.IsNullOrEmpty(this.Request.Form[id]))

Code:

namespace RC.RPC_Group.UI
{
    public class BasePage : System.Web.UI.Page
    {
        protected override void OnPreInit(EventArgs e)
        {
            string id = Globals.ThemesSelectorID;
            if (id.Length > 0)
            {
                // if this is a postback caused by the theme selectors dropdownlist,
                // retrieve the selected theme and unse it for the current page request
                if (this.Request.Form["__EVENTTARGET"] == id &&
                    !string.IsNullOrEmpty(this.Request.Form[id]))
                {
                    this.Theme = this.Request.Form[id];
                    this.Session["CurrentTheme"] = this.Theme;
                }
                else
                {
                    if (this.Session["CurrentTheme"] != null)
                        this.Theme = this.Session["CurrentTheme"].ToString();
                }
            }
            base.OnPreInit(e);
        }
    }
}

Code:

using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using RC.RPC_Group;
namespace RC.RPC_Group.UI.Controls
{
    public partial class ThemeSelector : System.Web.UI.UserControl
    {
        string themeName = "";
        protected void Page_Load(object sender, EventArgs e)
        {
            if (Globals.ThemesSelectorID.Length == 0)
                Globals.ThemesSelectorID = blueMidnight.UniqueID;
        }
        protected void blueTheme_Box_Click(object sender, ImageClickEventArgs e)
        {
            themeName = "blueMidnight";
            Globals.ThemesSelectorID = blueMidnight.UniqueID;
        }
        protected void redTheme_Box_Click(object sender, ImageClickEventArgs e)
        {
            themeName = "maroonBlood";
            Globals.ThemesSelectorID = maroonBlood.UniqueID;
        }
        protected void goldTheme_Box_Click(object sender, ImageClickEventArgs e)
        {
            themeName = "goldLabel";
            Globals.ThemesSelectorID = goldLabel.UniqueID;
        }
}
}