Using AJAX to Dynamically Update a GridView, DataList, or any Data-bound Control – New Features in ASP.NET 4
ASP.NET server controls render HTML elements with id attributes that are often different from the ID values you assign in markup or code. The id attributes are generated by concatenating a server control’s ID with the IDs of any container controls it is in (except the page). Data-bound controls that render multiple rows also add a sequential index to make the elements in each row unique.
When you want to reference an HTML element in client script, you typically pass the id of the element to the document.getElementbyId method. Therefore, if you want to write JavaScript code to change how a server control is displayed in the browser, you need to know what the id attribute will be. In two common scenarios that can be difficult:
- The server control and the JavaScript that updates it on the client are in a Web user control. You cannot predict what page or container control the Web user control will be in, so you cannot predict what its HTML id attribute will be.
- The server control is data-bound and generates multiple rows. For example, you call a Web service to update a subset of the displayed rows. You have the data key values for the rows you want to update, but the id attributes of individual controls inside the data-bound control have a sequential index, and you have no way to associate the data key with the id attributes of the corresponding HTML elements.
ASP.NET 4 provides a way to solve both of these problems. In ASP.NET 4 you can specify that the id attributes of HTML elements in rows of data-bound controls include the data key values instead of sequential indexes. And you can specify that the id attributes are generated without prefixing the IDs of container controls.
For more information, see the documentation for the new Control.ClientIDMode property and the following topics:
- ASP.NET Control Identification
- Walkthrough: Making Data-Bound Controls Easier to Access from JavaScript
- Walkthrough: Making Controls Located in Web User Controls Easier to Access From JavaScript
-- Tom Dykstra
ASP.NET User Education
This posting is provided "AS IS" with no warranties, and confers no rights.
Give Your Feedback on the Documentation
Help us improve the developer documentation by taking the Visual Studio and .NET Framework Content Survey. This survey will give us a better understanding of the type of applications you are developing as well as how you use Help and how we can improve it. The survey takes only 10 minutes, and we appreciate your feedback
Comments
- Anonymous
May 21, 2009
PingBack from http://asp-net-hosting.simplynetdev.com/using-javascript-to-access-html-elements-rendered-for-server-controls-%e2%80%93-new-features-in-aspnet-4/