ASP.NET Custom/User Control With Children

I want a create a custom/user control that has children.

For Example, I want my control to have the following markup:

<div runat="server" id="div">
    <label runat="server" id="label"></label>
    <div class="field">
        <!-- INSERT CHILDREN HERE -->
    </div>
</div>

and when I want to use it on a page I simply:

<ctr:MyUserControl runat="server" ID="myControl">
    <span>This is a child</span>
    <div runat="server" id="myChild">And another <b>child</b>
</ctr:MyUserControl>

The child controls inside my user control will be inserted into my user control somewhere. What is the best way to accomplish this?

The functionality is similar to a asp:PlaceHolder but I want to add a开发者_JAVA技巧 couple more options as well as additional markup and the such. Also the child controls still need to be able to be accessed by the page. (in the example above the page should have the myChild Control on it)

EDIT ------

It can be a template control as long as it allows me to reference the children on the page.

---

I asked something similar myself a while ago. See here.

I believe you will have to use an ITemplate as an InnerProperty:

[PersistenceMode(PersistenceMode.InnerProperty)]
[DesignerSerializationVisibility(DesignerSerializationVisibility.Content)]
[TemplateInstance(TemplateInstance.Single)]
public ITemplate Content
{
    get
    {
        return _content;
    }
    set
    {
        _content = value;
    }
}
private ITemplate _content;

Then override the CreateChildControls method of your control:

protected override void CreateChildControls()
{
   if (this.Content != null)
   {
      this.Controls.Clear();
      this.Content.InstantiateIn(this);
   }
   base.CreateChildControls();
}

What's the harm in using an ITemplate You can combine it with your existing markup and write whatever HTML you want within the Content property.

---

Another way to approach this would be to look at the source of the Panel control (using Reflector for example). It looks like it just overrides the RenderBeginTag and RenderEndTag methods (among others to add attributes and whatnot) and defers the rest of the rendering to the WebControl class.

---

I know that the answer is a bit old but I have a problem which was not mentioned here.

I've tried this solution and it works well if the content are default aspx controls or plain html tags. When I put a custom web control inside I have a problem with NullReferenceException in the custom web control (child controls are all null). I overloaded OnInit method (in the custom web control code behind) to call EnsureChildControls() but child controls are not still instantiated. Do you have any idea or sugestions what the point is?

Here is the code which I use to instantiate the controls:

        this._pnlButtons.Controls.Add( _lbtnOkHidden );
        this._pnlButtons.Controls.Add( _lgbtnOk );

        this._pnlPopup.Controls.Add( _pnlHeader );
        this._pnlPopup.Controls.Add( _pnlContent );
        this._pnlPopup.Controls.Add( _pnlButtons );

        if ( this.Content != null )
            this.Content.InstantiateIn( _pnlContent );

        this._updatePanel.ContentTemplateContainer.Controls.Add( _lbShowPopup );
        this._updatePanel.ContentTemplateContainer.Controls.Add( _lbtnShowPopupHidden );
        this._updatePanel.ContentTemplateContainer.Controls.Add( _pnlPopup );
        this._updatePanel.ContentTemplateContainer.Controls.Add( _modalExtender );

        this.Controls.Add(_updatePanel);
        base.CreateChildControls();