ASP .NET | Client/Server Side Action with asp:Button

The asp:Button imitates the HTML input button's onclick event by having a property called OnClick. However, this property can only be set to a valid method name that is executed on the server. More, since the property is named the same as the HTML event, it's not possible to add client side code directly to the asp:Button tag using the onclick attribute that gets excecuted upon a click.

ASP solves this problem by adding another property called OnClientClick that can be set to execute any client side code. Then during compilation, the ASP .NET worker process consolidates both codes into the one HTML event 'onclick' because both codes must be executed upon the same event, a click. ASP .NET only compiles a page if it's modified otherwise it grabs the page from the cache by default. For the server side code, the only thing that is added is client side code that posts the page back using the button id to identify the control that caused the post back. After the page is posted back, the server side code gets executed.

In contrast, since other events don't have a matching asp:Button property they can be added directly to the asp:Button tag and ASP .NET will add them to the HTML tag generated for the button. For example, onfocus, onblur, onselect and other event attributes can be added directly as follows:


<asp:button id="btnPost" runat="server" onblur="javascript:blured()" onfocus="javascript:focused();" />


HTML attributes can also be added progromatically such as in C#:

btnPost.Attributes.Add("ondblclick", "javascript:dblClicked();");
btnPost.Attributes["onkeypress"] = "javascript:pressed();";