Sintassi dichiarativa per il controllo server HtmlInputImage
Crea un controllo lato server che viene mappato all'elemento HTML <input type=image> e consente di creare un pulsante che visualizza un'immagine.
<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"
/>
Note
Utilizzare il controllo HtmlInputImage per eseguire la programmazione in base all'elemento HTML <input type=image>. È possibile utilizzare il controllo insieme a HtmlInputText, HtmlTextArea e ad altri controlli per costruire form di input dell'utente. Poiché il controllo è l'elemento <input type=image> che viene eseguito sul server, consente di eseguire la stessa personalizzazione dei pulsanti di HTML. Rappresenta inoltre un'alternativa per i browser che non supportano l'HTML dinamico (DHTML) e il controllo HtmlButton.
.gif "Nota") Nota |
|---|
Il controllo non richiede un tag di chiusura. |
Uno dei vantaggi offerti dai controlli HTML rispetto ai controlli Web consiste nel fatto che gli eventi del lato server non sono in conflitto con gli eventi che si verificano sul client, a meno che il codice per il lato server e quello per il lato client non contrastino tra di loro. In questo caso è possibile utilizzare gli eventi DHTML per modificare l'aspetto di qualsiasi immagine che viene inserita nella pagina Web Form.
Esempio
Nell'esempio riportato di seguito viene confrontato il controllo di tipo pulsante per un'immagine statica con un controllo di tipo pulsante per un'immagine che utilizza l'evento DHTML onMouseOver, che visualizza l'immagine di una banana, e l'evento onMouseOut, che visualizza l'immagine originale del mango. Entrambi i pulsanti delle immagini comprendono un gestore eventi 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>