Templates

NavigateUrl and Template

The content of WindowBase-based controls such as Window, AccordionItem and TabPage can be specified either by setting the NavigateUrl property or by assigning an ITemplate to the Template property. When a NavigateUrl is specified the content of the external web page that url is pointing to will be loaded in an internally created iframe inside the window's content element. When a template is assigned to the Template property, the control will act as an INamingContainer for the controls defined in the template.

Designing templates with the Visual Studio designer

Right-click on a host control's (for a example a TabControl) design surface to bring up the context menu or use the Smart Tag to navigate to the "Edit Templates" item, to select the specific child item to template.



This will invoke the built-in Visual Studio template designer, which allows dragging controls from the Visual Studio Toolbox onto the design surface to create the template. Using two Label, two TextBox and one Button controls could yield a result similar to this:

When done, choose the "End Template Editing" option (either from the right-click context menu or from the Smart Tag), and the markup for the template will be generated for the particular item.

Assigning templates from markup

The following code shows how to assign a simple template to an AccordionItem from markup.

ASPX

<ui:AccordionItem ID="AccordionItem1" runat="server" Title="Template defined in markup">
    <Template>
        <label for="first_name">First Name</label>
        <input  type="text" name="first_name" maxlength="50" size="30" />
    </Template>
</ui:AccordionItem>

Assigning templates programmatically

In order to use templates programmatically create a template class and assign it to the Template property of the control.

C#

Window.Template = new SampleWindowTemplate();

VB.NET

Window.Template = New SampleWindowTemplate()

The template class should implement the ITemplate interface. Implement its InstantiateIn method to add your custom logic.

C#

public class SampleWindowTemplate : ITemplate
{
    public SampleWindowTemplate()
    {
    }
    public void InstantiateIn(System.Web.UI.Control container)
    {
        Label label1 = new Label();
        label1.Text = "First Name";
        TextBox textbox = new TextBox();
        textbox.ID = "TemplateTextBox";
        container.Controls.Add(label1);
        container.Controls.Add(textbox);
    }
}

VB.NET

Public Class SampleWindowTemplate
    Implements ITemplate
    Public Sub New()
    End Sub

    Public Sub InstantiateIn(container As System.Web.UI.Control)
        Dim label1 As New Label()
        label1.Text = "First Name"
        Dim textbox As New TextBox()
        textbox.ID = "TemplateTextBox"
        container.Controls.Add(label1)
        container.Controls.Add(textbox)
    End Sub
End Class

Note
Dynamically created templates wont be persisted across postbacks, so make sure to keep your data intact by reassigning them in the Page_Load phase.

C#

protected void Page_Load(object sender, EventArgs e)
{
    WindowHost1.Windows[0].Template = new SampleWindowTemplate();
}

VB.NET

Protected Sub Page_Load(sender As Object, e As EventArgs)
    WindowHost1.Windows(0).Template = New SampleWindowTemplate()
End Sub