| aspxtreme |
Home Getting Started Web Forms Web Applications ADO.NET ASP/ADO Back to Basics |
  |
ImageButton Control Syntax
ASP.NET Syntax ASP.NET Syntax for Web Controls
Enables you to handle user clicks in an image, which gives you image map like functionality.
Declarative SyntaxFor information on the individual members of this class, see ImageButton in the class library.
Remarks
Use the ImageButton control to display an image that responds to mouse clicks.
Both the Click and Command events are raised when the ImageButton control is clicked. These events always cause the page to be posted to the server.
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 the origin ( 0, 0 ) is located at the upper-left corner of the image.
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. The CommandArgument property can also be used to pass additional information about the command, such as specifying ascending order.
Syntax Example
The following example demonstrates how to specify and code a handler for the Click event to display the coordinates where the user clicks the image.
Within the <head> of the Web Forms page:
<script language="C#" runat="server">
void ImageButtonClickHandler ( object sender, ImageClickEventArgs e ) {
msgLabel.Text = "You clicked the ImageButton control at the coordinates: ( " +
e.X.ToString ( ) + ", " + e.Y.ToString ( ) + " ) ";
}
</script>
| ||
| C# | VB | |
Within the <body> of the Web Forms page:
<form runat="server">
<asp:ImageButton id="imagebutton1" runat="server"
AlternateText = "ImageButton 1"
ImageAlign = "left"
ImageUrl = "images/pict.jpg"
onClick = "ImageButtonClickHandler" />
<p><asp:label id="msgLabel" runat="server" />
</form>
The following example demonstrates how to specify and code a handler for the Command event to determine which ImageButton control is clicked.
Within the <head> of the Web Forms page:
<script language="C#" runat="server">
void ImageButtonCommandHandler ( object sender, CommandEventArgs e ) {
if ( e.CommandName == "Sort" && e.CommandArgument == "Ascending" )
msgLabel.Text = "You clicked the Sort Ascending Button";
else
msgLabel.Text = "You clicked the Sort Descending Button";
}
</script>
| ||
| C# | VB | |
Within the <body> of the Web Forms page:
<form runat="server">
<asp:ImageButton id="imagebutton1" runat="server"
AlternateText = "Sort Ascending"
ImageUrl = "images/pict.jpg"
onCommand = "ImageButtonCommandHandler"
CommandName = "Sort"
CommandArgument = "Ascending" />
<asp:ImageButton id="imagebutton2" runat="server"
AlternateText = "Sort Descending"
ImageUrl = "images/pict2.jpg"
onCommand = "ImageButtonCommandHandler"
CommandName = "Sort"
CommandArgument = "Descending" />
<p><asp:label id="msgLabel" runat="server" />
</form>
See Also
ImageButton Class Button Web Server Controls
