Syntaxe déclarative du contrôle serveur HtmlInputImage
Crée un contrôle côté serveur mappé à l'élément HTML <input type=image> et permet de créer un bouton qui affiche une image.
<input
Type="Image"
EnableViewState="False|True"
Id="string"
Visible="False|True"
OnDataBinding="OnDataBinding event handler"
OnDisposed="OnDisposed event handler"
OnInit="OnInit event handler"
OnLoad="OnLoad event handler"
OnPreRender="OnPreRender event handler"
OnServerClick="OnServerClick event handler"
OnUnload="OnUnload event handler"
runat="server"
/>
Notes
Utilisez le contrôle HtmlInputImage pour programmer en vous servant de l'élément <input type=image> HTML. Vous pouvez utiliser ce contrôle conjointement avec HtmlInputText, HtmlTextArea et d'autres contrôles pour générer des formulaires d'entrée d'utilisateur. Dans la mesure où ce contrôle est l'élément <input type=image> exécuté sur le serveur, il offre les mêmes possibilités de personnalisation de bouton que le code HTML. Ce contrôle offre une solution alternative aux navigateurs qui ne prennent pas en charge DHTML (Dynamic HTML) et le contrôle HtmlButton.
.gif "Remarque") Remarque |
|---|
Ce contrôle ne nécessite pas de balise de fermeture. |
L'un des avantages des contrôles HTML par rapport aux contrôles Web réside dans le fait que les événements côté serveur n'entrent pas en conflit avec les événements qui se produisent sur le client, à moins que les codes côté client et côté serveur eux-mêmes ne se contredisent. Si c'est le cas, vous pouvez utiliser des événements DHTML (Dynamic HTML) pour modifier l'apparence de toute image que vous incluez dans votre page Web Forms.
Exemple
L'exemple suivant compare un contrôle de bouton d'image statique avec un contrôle de bouton d'image qui utilise l'événement DHTML onMouseOver (qui affiche l'image d'une banane) et l'événement onMouseOut (qui affiche l'image d'origine, à savoir, celle d'une mangue). Les deux boutons d'image incluent un gestionnaire d'événements OnServerClick.
<%@ Page Language="VB" 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>HtmlInputImage Control</title>
<script runat="server">
Sub Button1_Click(Source As Object, e As ImageClickEventArgs)
Span1.InnerHtml = "You clicked button1"
End Sub
Sub Button2_Click(Source As Object, e As ImageClickEventArgs)
Span1.InnerHtml = "You clicked button2"
End Sub
</script>
</head>
<body>
<h3>HtmlInputImage Sample</h3>
<form id="Form1" runat="server">
<input type="image"
id="InputImage1"
src="/images/mango.jpg"
onserverclick="Button1_Click"
runat="server" />
<br />
<input type="image"
id="InputImage2"
src="/images/mango.jpg"
onmouseover="this.src='/images/banana.jpg';"
onmouseout="this.src='/images/mango.jpg';"
onserverclick="Button2_Click"
runat="server" />
With rollover effect (HTML 4.0)
<br />
<span id="Span1" runat="server" />
</form>
</body>
</html>
<%@ 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>HtmlInputImage Control</title>
<script runat="server">
void Button1_Click(object Source, ImageClickEventArgs e)
{
Span1.InnerHtml="You clicked button1";
}
void Button2_Click(object Source, ImageClickEventArgs e)
{
Span1.InnerHtml="You clicked button2";
}
</script>
</head>
<body>
<h3>HtmlInputImage Sample</h3>
<form id="Form1" runat="server">
<input type="image"
id="InputImage1"
src="/images/mango.jpg"
onserverclick="Button1_Click"
runat="server" />
<br />
<input type="image"
id="InputImage2"
src="/images/mango.jpg"
onmouseover="this.src='/images/banana.jpg';"
onmouseout="this.src='/images/mango.jpg';"
onserverclick="Button2_Click"
runat="server" />
With rollover effect (HTML 4.0)
<br />
<span id="Span1" runat="server" />
</form>
</body>
</html>