How to use ClientIDMode in ASP.NET 4

Barış Velioğlu picture Barış Velioğlu · Aug 30, 2011 · Viewed 9.8k times · Source

The default value of ClientIDMode for a page is AutoID. The default value of ClientIDMode for a control is Inherit. If you do not set ClientIDMode for a page or for any controls on the page, all controls will use the AutoID algorithm.

This is from msdn. But when I created a web application in ASP.NET 4 or even 3.5, all of the ids of the control are what I have written for them. They are not generated by the autoId algorithm. Then I tried to manually add clientIDMode="AutoID" to the controls, it also doesnt work what I was expected. So what is the problem ? Is there any rule to make it available ?

Thanks in advance,

EDITED

This is in .aspx page

<div>
    <asp:Panel ID="Panel1" runat="server">
        <asp:Panel ID="Panel2" runat="server">
            <asp:Panel ID="Panel3" runat="server">
                <asp:Panel ID="Panel4" runat="server">
                    (:
                </asp:Panel>
            </asp:Panel>
        </asp:Panel>
    </asp:Panel>
</div>

This is output:

<div id="Panel1">
        <div id="Panel2">

                <div id="Panel3">

                    <div id="Panel4">
                        (:
                </div>

        </div>

    </div>
</div>

Answer

Tim B James picture Tim B James · Aug 30, 2011

The reason you are getting all your Id's coming out the way you are is because there is no reason for the .NET framework to change them.

If you had placed your Panel's within a Repeater control, then they would all change to avoid multiple ID's of the same name.

Example (not correct markup):

<asp:Repeater id="repeater1" runat="server">
  <template>
      <asp:Panel id="Panel1" runat="server">
          <asp:Panel id="Panel2" runat="server">

          </asp:Panel>
      </asp:Panel>
  </template>
</asp:Repeater>

Your HTML which is generated from this would show that the Panel id's have been changed to inherit from the containing control. Something like repeater1_ct100_Panel1

The same happens when you are using Master Pages, Content Holders, and DataBound Controls. .NET updates the ID's to avoid multiple ID's of the same name.