ASP.NET is great at separating design and code elements on the server side. This extends to a powerful yet simple way of adding your own custom controls to your ASP.NET websites.
I’ll explain the simpler system I have developed. My aims were:
- To allow unique HTML IDs, so that there can be more than one control of that type per page, with each control operating independently.
My method enables links not only between server and client sides of a user control, but between controls and their parent elements on the client side (just as could be done on the server side). Think of it as “client-side code behind”.
How it works
- An ASP.NET control is set up in the usual way with code behind which adds the .ascx and .ascx.cs files to the project.
- The developer adds a .ascx.js file to the project for the client-side components, with a matching name.
- function TrackBar(clientID, minimum, maximum, smallChange, barPixelWidth)
- <%=ID%>= new TrackBar('<%=ClientID%>', <%=Minimum%>, <%=Maximum%>, <%=SmallChange%>, <%=BarPixelWidth%>);
The use of runat=”server” is necessary because although a static client ID could be provided, this would not have a name unique to the page, and would therefore not allow more than one control of that type per form or parent control.
The control changes the text in the TextBox which gives a return path of data to the server side. An example of this can be seen in the code in the Default.aspx.cs file.