Take Control Of Web Control ClientID Values in ASP.NET 4.0

<p> Each server-side Web control in an ASP.NET Web Forms application has an <code>ID</code> property that identifies the Web control and is name by which the Web control is accessed in the code-behind class. When rendered into HTML, the Web control turns its server-side <code>ID</code> value into a client-side <code>id</code> attribute. Ideally, there would be a one-to-one correspondence between the value of the server-side <code>ID</code> property and the generated client-side <code>id</code>, but in reality things simple. By default, the rendered client-side <code>id</code> is formed by taking the Web <code>ID</code> property and prefixed it with the <code>ID</code> properties of its <i>naming containers</i>. In short, a Web control with an ID of <code>txtName</code> can get rendered into an HTML element with a client-side <code>id</code> like <code>ctl00_MainContent_txtName</code>. </p><p> This default translation from the server-side <code>ID</code> property value to the rendered client-side <code>id</code> attribute can introduce challenges when trying to access an HTML element via JavaScript, which is typically done by <code>id</code>, as the page developer building the web page and writing the JavaScript does not know what the <code>id</code> value of the rendered Web control will be at design time. (The client-side <code>id</code> value can be determined at runtime via the Web property</a>.) </p><p> ASP.NET 4.0 affords page developers much greater flexibility in how Web controls render their <code>ID</code> property into a client-side <code>id</code>. This article starts with an explanation as to why and how ASP.NET translates the server-side <code>ID</code> value into the client-side <code>id</code> value and then shows how to take control of this process using ASP.NET 4.0. Read on to learn more! <br /><a More &gt;</a></p>

Read More...

---