How to make a UserControl being wrapped inside a DIV with the generated ClientID

Question

If I have a UserControl like this:

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="Foo.ascx.cs" Inherits="Foo" %>
<asp:TextBox runat="server" ID="TxtFoo" />

And I include it into my page as follows:

...
<uc:Foo runat="server" ID="UcFoo" />
...

I would like to have my UserControl being wrapped inside a DIV with the ClientID as follows:

<div id="ctl00$ContentPH$UcFoo">
  <input type="text" name="ctl00$ContentPH$UcFoo$TxtFoo" id="ctl00$ContentPH$UcFoo$TxtFoo" />
</div>

But actually I'm getting the content without the DIV tag. So the question here is: How can I tell ASP.NET to render my control inside a DIV with the auto-generated ClientID?

Answer 1

Wrap the contents of your UserControl inside a <div> with an id attribute:

<div id="<%= this.ClientID %>">
    <asp:TextBox runat="server" ID="TxtFoo" />
</div>

Note that the ClientID will contain underscores, not dollar signs (as in your example).

Answer 2

Option 1:

<asp:Panel runat="server">
  <asp:TextBox runat="Server" Id="txtFoo" />
</asp:Panel>

Option 2:

Write a custom control, override the Render method & write out your own string...

HTH.