ASP Nested Tags in a Custom User Control

Question

I'm just getting started with Custom User Controls in C# and I'm wondering if there are any examples out there of how to write one which accepts nested tags?

For example, when you create an asp:repeater you can add a nested tag for itemtemplate.

Rob · Accepted Answer · 2019-02-04 13:41:04Z

17

I wrote a blog post about this some time ago. In brief, if you had a control with the following markup:

<Abc:CustomControlUno runat="server" ID="Control1">
    <Children>
        <Abc:Control1Child IntegerProperty="1" />
    </Children>
</Abc:CustomControlUno>

You'd need the code in the control to be along the lines of:

[ParseChildren(true)]
[PersistChildren(true)]
[ToolboxData("<{0}:CustomControlUno runat=server></{0}:CustomControlUno>")]
public class CustomControlUno : WebControl, INamingContainer
{
    private Control1ChildrenCollection _children;

    [PersistenceMode(PersistenceMode.InnerProperty)]
    [DesignerSerializationVisibility(DesignerSerializationVisibility.Content)]
    public Control1ChildrenCollection Children
    {
        get
        {
            if (_children == null)
            {
                _children = new Control1ChildrenCollection();
            }
            return _children;
        }
    }
}

public class Control1ChildrenCollection : List<Control1Child>
{
}

public class Control1Child
{
    public int IntegerProperty { get; set; }
}

edited Feb 4, 2019 at 13:41

answered Sep 23, 2008 at 13:31

Rob

45.9k24 gold badges126 silver badges155 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Iain Holder Over a year ago

Don't think it's poor form at all if it answers the question. It's when people write blog posts ONLY post. That's when it's insane making. Have a click.

Joachim VR Over a year ago

Wow, this has been standing here for over three years now, and all this time I've been slapped across the face with overly complicated and elaborate 'examples' that didn't really work at all. Thank you!

tjmoore Over a year ago

The problem with linked blog posts as an answer is when the site becomes dead. Which is the case as I'm typing. Thus I can't see the answer.

drzaus Over a year ago

@tjmoore I agree -- try looking it up on The Wayback Machine

Guðmundur H · Accepted Answer · 2009-07-09 06:54:43Z

I followed Rob's blog post, and made a slightly different control. The control is a conditional one, really just like an if-clause:

<wc:PriceInfo runat="server" ID="PriceInfo">
    <IfDiscount>
        You don't have a discount.
    </IfDiscount>
    <IfNotDiscount>
        Lucky you, <b>you have a discount!</b>
    </IfNotDiscount>
</wc:PriceInfo>

In the code I then set the HasDiscount property of the control to a boolean, which decides which clause is rendered.

The big difference from Rob's solution, is that the clauses within the control really can hold arbitrary HTML/ASPX code.

And here is the code for the control:

using System.ComponentModel;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace WebUtilities
{
    [ToolboxData("<{0}:PriceInfo runat=server></{0}:PriceInfo>")]
    public class PriceInfo : WebControl, INamingContainer
    {
        private readonly Control ifDiscountControl = new Control();
        private readonly Control ifNotDiscountControl = new Control();

        public bool HasDiscount { get; set; }

        [PersistenceMode(PersistenceMode.InnerProperty)]
        [DesignerSerializationVisibility(DesignerSerializationVisibility.Content)]
        public Control IfDiscount
        {
            get { return ifDiscountControl; }
        }

        [PersistenceMode(PersistenceMode.InnerProperty)]
        [DesignerSerializationVisibility(DesignerSerializationVisibility.Content)]
        public Control IfNotDiscount
        {
            get { return ifNotDiscountControl; }
        }

        public override void RenderControl(HtmlTextWriter writer)
        {
            if (HasDiscount)
                ifDiscountControl.RenderControl(writer);
            else
                ifNotDiscountControl.RenderControl(writer);
        }
    }
}

Community · Accepted Answer · 2017-05-23 12:31:17Z

I ended up with something very similar to the answer by Rob (in wayback archive) @gudmundur-h, but I used ITemplate to get rid of that annoying "You can't place content between X tags" in the usage. I'm not entirely sure what is actually required or not, so it's all here just in case.

The partial/user control markup: `mycontrol.ascx`

Note the important bits: plcChild1 and plcChild2.

<!-- markup, controls, etc -->
<div class="shell">
    <!-- etc -->

    <!-- optional content with default, will map to `ChildContentOne` -->
    <asp:PlaceHolder ID="plcChild1" runat="server">
        Some default content in the first child.
        Will show this unless overwritten.
        Include HTML, controls, whatever.
    </asp:PlaceHolder>

    <!-- etc -->

    <!-- optional content, no default, will map to `ChildContentTwo` -->
    <asp:PlaceHolder ID="plcChild2" runat="server"></asp:PlaceHolder>

</div>

The partial/user control codebehind: `mycontrol.ascx.cs`

[ParseChildren(true), PersistChildren(true)]
[ToolboxData(false /* don't care about drag-n-drop */)]
public partial class MyControlWithNestedContent: System.Web.UI.UserControl, INamingContainer {
    // expose properties as attributes, etc

    /// <summary>
    /// "attach" template to child controls
    /// </summary>
    /// <param name="template">the exposed markup "property"</param>
    /// <param name="control">the actual rendered control</param>
    protected virtual void attachContent(ITemplate template, Control control) {
        if(null != template) template.InstantiateIn(control);
    }

    [PersistenceMode(PersistenceMode.InnerProperty),
    DesignerSerializationVisibility(DesignerSerializationVisibility.Content)]
    public virtual ITemplate ChildContentOne { get; set; }

    [PersistenceMode(PersistenceMode.InnerProperty), DesignerSerializationVisibility(DesignerSerializationVisibility.Content)]
    public virtual ITemplate ChildContentTwo { get; set; }

    protected override void CreateChildControls() {
        // clear stuff, other setup, etc
        // needed?
        base.CreateChildControls();

        this.EnsureChildControls(); // cuz...we want them?

        // using the templates, set up the appropriate child controls
        attachContent(this.ChildContentOne, this.plcChild1);
        attachContent(this.ChildContentTwo, this.plcChild2);
    }
}

Important bits (?):

ParseChildren -- so stuff shows up?
PersistChildren -- so dynamically created stuff doesn't get reset?
PersistenceMode(PersistenceMode.InnerProperty) -- so controls are parsed correctly
DesignerSerializationVisibility(DesignerSerializationVisibility.Content) -- ditto?

The control usage

<%@ Register Src="~/App_Controls/MyStuff/mycontrol.ascx" TagPrefix="me" TagName="MyNestedControl" %>

<me:MyNestedControl SomeProperty="foo" SomethingElse="bar" runat="server" ID="meWhatever">
    <%-- omit `ChildContentOne` to use default --%>
    <ChildContentTwo>Stuff at the bottom! (not empty anymore)</ChildContentTwo>
</me:MyNestedControl>

Viktor Elofsson · Accepted Answer · 2008-09-23 13:34:00Z

1

My guess is you're looking for something like this? http://msdn.microsoft.com/en-us/library/aa478964.aspx

Your tags were removed or are invisible, so can't really help you there.

answered Sep 23, 2008 at 13:34

Viktor Elofsson

1,6112 gold badges14 silver badges21 bronze badges

Collectives™ on Stack Overflow

ASP Nested Tags in a Custom User Control

4 Answers 4

4 Comments

Comments

The partial/user control markup: `mycontrol.ascx`

The partial/user control codebehind: `mycontrol.ascx.cs`

The control usage

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

4 Comments

Comments

The partial/user control markup: mycontrol.ascx

The partial/user control codebehind: mycontrol.ascx.cs

The control usage

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related

The partial/user control markup: `mycontrol.ascx`

The partial/user control codebehind: `mycontrol.ascx.cs`