Introduction
Use the ImageButton control to display an image that responds to mouse clicks.
You can use the OnCommand event handler to make the ImageButton control behave like a Command button. A command name can be associated with the control by using the CommandName property. This allows multiple ImageButton controls to be placed on the same Web page. The value of the CommandName property can then be programmatically identified in the OnCommand event handler to determine the appropriate action to perform when each ImageButton control is clicked. TheCommandArgument property can also be used to pass additional information about the command, such as specifying ascending order.
Using the ImageButton control is similar to using the ASP.NET Button control. For more information, see Button Web Server Controls Content Map. and the class overview for the Button control.
Determining Where the User Clicked
By using the OnClick event handler, you can programmatically determine the coordinates where the image is clicked. You can then code a response, based on the values of the coordinates. Note that the origin (0, 0) is located at the upper left corner of the image.
ImageButton Controls and Validation
By default, page validation is performed when an ImageButton control is clicked. Page validation determines whether the input controls associated with a validation control on the page all pass the validation rules specified by the validation control. To prevent page validation from occurring, set the CausesValidation property to false.
Example:
The following code example demonstrates how to create an ImageButton control that displays the coordinates at which an image is clicked.
<%@ Page Language="C#" AutoEventWireup="True" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head> <title>ImageButton Sample</title> <script language="C#" runat="server"> void ImageButton_Click(object sender, ImageClickEventArgs e) { Label1.Text = "You clicked the ImageButton control at the coordinates: (" + e.X.ToString() + ", " + e.Y.ToString() + ")"; } </script> </head> <body> <form id="form1" runat="server"> <h3>ImageButton Sample</h3> Click anywhere on the image.<br /><br /> <asp:ImageButton id="imagebutton1" runat="server" AlternateText="ImageButton 1" ImageAlign="left" ImageUrl="images/pict.jpg" OnClick="ImageButton_Click"/> <br /><br /> <asp:label id="Label1" runat="server"/> </form> </body> </html>
No comments:
Post a Comment