Article ID: 311945 - Last Review: April 3, 2006 - Revision: 2.6

PRB: Templates That Are Applied Programmatically Are Not Rendering

Retired KB ArticleRetired KB Content Disclaimer
View products that this article applies to.
System TipThis article applies to a different operating system than the one you are using. Article content that may not be relevant to you is disabled.
This article was previously published under Q311945

On This Page

Expand all | Collapse all

SYMPTOMS

When you try to programmatically apply a mobile StyleSheet control that contains templates, you may find that the style is not applied. You may also notice that if you apply style templates declaratively at design time, changing the style programmatically (to a non-templated style) does not remove the previously-applied templates.
Back to the top

CAUSE

If you apply a StyleSheet that contains DeviceSpecific templates (such as a Header Template, or a Footer Template) programmatically in code as opposed to applying declaratively at design time, you need to set the StyleSheet before the templates are instantiated at run time. The StyleSheet is not applied if you set it in an event (such as a Page_Load event) that executes after the templates have been instantiated. The form's Init event executes prior to the templates being instantiated.
Mobile controls that support templating (ObjectList, List, and SelectionList) can have templates set in other events such as the Load event for the page.
Back to the top

RESOLUTION

You need to set the StyleReference for a Mobile Form in the form's Init event to change the templates dynamically. The following code demonstrates how to set the form's StyleReference property in the form's Init event.

To use the following code, in the textbox, type in the name of the Style (templateStyle1 or templateStyle2) that you want to be applied to the form, and then click the Change Style button: 
<%@ Page language="c#" Inherits="System.Web.UI.MobileControls.MobilePage" AutoEventWireup="true" %>
<%@ Register TagPrefix="mobile" Namespace="System.Web.UI.MobileControls" Assembly="System.Web.Mobile" %>

<mobile:Form id="Form1" runat="server" OnInit="TheForm_Init" >
	<mobile:TextBox id="txtStyle" runat="server" />
   <mobile:Label id="Label1" runat="server" Text="Fore Color" />
   <mobile:Command runat="server" Text="Change Style" ID="Command1" />
</mobile:Form>

<mobile:StyleSheet id="StyleSheet1" runat=server>
  <Style name="templateStyle1" BackColor="Green" ForeColor ="Blue">
    <DeviceSpecific> 
      <Choice> 
        <HeaderTemplate> 
          <mobile:Label id="Label2" runat="server">Header Template</mobile:Label> 
        </HeaderTemplate> 
        <FooterTemplate> 
          <mobile:Label id="Label3" runat="server">Footer Template</mobile:Label> 
        </FooterTemplate>
      </Choice> 
    </DeviceSpecific>
  </Style> 
  <Style Name="templateStyle2" BackColor="Brown" ForeColor ="Yellow">
    <DeviceSpecific> 
      <Choice> 
        <HeaderTemplate> 
          <mobile:Label id="Label2" runat="server">Header Template</mobile:Label> 
        </HeaderTemplate> 
        <FooterTemplate> 
          <mobile:Label id="Label3" runat="server">Footer Template</mobile:Label> 
        </FooterTemplate>
      </Choice> 
    </DeviceSpecific>
  </Style>
</mobile:StyleSheet>

<script runat="server" language="c#">

public void TheForm_Init(Object sender, EventArgs e)
{
	if(IsPostBack)
	{
		Form1.StyleReference = Request.Form["txtStyle"].ToString();
	}
}
</script>
Back to the top

STATUS

This behavior is by design.
Back to the top

MORE INFORMATION

Steps to Reproduce the Behavior

The following code defines a StyleSheet control at design time. The StyleSheet contains two Styles. One Style contains templates and the other does not. Clicking on one of the buttons programmatically changes the StyleReference on the form. When you run this sample code and click the Template Style button, the Style properties are applied to the form, but not to the templates.
<%@ Page language="c#" Inherits="System.Web.UI.MobileControls.MobilePage" AutoEventWireup="true" %>
<%@ Register TagPrefix="mobile" Namespace="System.Web.UI.MobileControls" Assembly="System.Web.Mobile" %>

<mobile:Form id="Form1" runat="server" >
   <mobile:Label id="Label1" runat="server" Text="Fore Color" />
   <mobile:Command runat="server" Text="Template Style" OnClick="ChangeToTemplateStyle" ID="Command1"/>
   <mobile:Command runat="server" Text="Simple Style" OnClick="ChangeToSimpleStyle" ID="Command2"/>
</mobile:Form>

<mobile:StyleSheet id="StyleSheet1" runat=server>
  <Style name="simpleStyle" BackColor="Green" ForeColor ="Blue"/> 
  <Style Name="templateStyle" BackColor="Brown" ForeColor ="Yellow" >
    <DeviceSpecific> 
      <Choice> 
        <HeaderTemplate> 
          <mobile:Label id="Label2" runat="server">Header Template</mobile:Label> 
        </HeaderTemplate> 
        <FooterTemplate> 
          <mobile:Label id="Label3" runat="server">Footer Template</mobile:Label> 
        </FooterTemplate>
          </Choice> 
    </DeviceSpecific>
  </Style>	
</mobile:StyleSheet>

<script runat="server" language="c#">

public void ChangeToTemplateStyle(Object sender, EventArgs e)
{
   Form1.StyleReference = "templateStyle";
}
public void ChangeToSimpleStyle(Object sender, EventArgs e)
{
   Form1.StyleReference = "simpleStyle";
}
</script>
Back to the top

REFERENCES

For additional information, click the following article number to view the article in the Microsoft Knowledge Base:
310898  (http://support.microsoft.com/kb/310898/EN-US/ ) HOW TO: Dynamically Create Data-Bound Templates Using Visual Basic .NET
Back to the top
APPLIES TO
  • Microsoft Mobile Internet Toolkit 1.0
Back to the top
Keywords: 
kbnofix kbprb kbservercontrols kbtemplate KB311945
Back to the top
Retired KB ArticleRetired KB Content Disclaimer
This article was written about products for which Microsoft no longer offers support. Therefore, this article is offered "as is" and will no longer be updated.
Back to the top