HtmlImage Server Control Declarative Syntax
Creates a server-side control that maps to the <img> HTML element and allows you to display an image.
<img
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"
OnUnload="OnUnload event handler"
runat="server"
/>
Remarks
Use the HtmlImage control to program against the HTML <img> element. This control allows you to dynamically set and retrieve the image's source, width, height, border width, alternate text, and alignment by using the Src, Width, Height, Border, Alt, and Align properties, respectively.
.gif) Note |
|---|
This control does not require a closing tag. |
Example
The following example shows how to change a displayed image, based on user choices. It specifies the /images directory as the source path for the images to display. The value selected in the HtmlSelect control in the Web Forms page determines which image to display from the /images directory.
<%@ 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>HtmlImage Control</title>
<script runat="server">
Sub SubmitBtn_Click(Sender As Object, e As EventArgs)
Image1.Src = "/images/" & Select1.Value
End Sub
</script>
</head>
<body>
<h3>HtmlImage Sample</h3>
<form id="Form1" runat="server">
<img id="Image1" src="/images/cereal1.gif" runat="server" alt="Cereal bowl"/>
<br />
<br />
Select an image file to display:
<select id="Select1" runat="server">
<option value="Cereal1.gif">Healthy Grains</option>
<option value="Cereal2.gif">Corn Flake Cereal</option>
<option value="Cereal3.gif">U.F.O.S</option>
<option value="Cereal4.gif">Oatey O's</option>
<option value="Cereal5.gif">Strike</option>
<option value="Cereal7.gif">Fruity Pops</option>
</select>
<br />
<br />
<input id="Submit1" type="submit" runat="server" value="Apply"
onserverclick="SubmitBtn_Click" />
</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>HtmlImage Control</title>
<script runat="server">
void SubmitBtn_Click(Object Sender, EventArgs e)
{
Image1.Src="/images/" + Select1.Value;
}
</script>
</head>
<body>
<h3>HtmlImage Sample</h3>
<form id="Form1" runat="server">
<img id="Image1" src="/images/cereal1.gif" runat="server" alt="Cereal bowl"/>
<br />
<br />
Select an image file to display:
<select id="Select1" runat="server">
<option value="Cereal1.gif">Healthy Grains</option>
<option value="Cereal2.gif">Corn Flake Cereal</option>
<option value="Cereal3.gif">U.F.O.S</option>
<option value="Cereal4.gif">Oatey O's</option>
<option value="Cereal5.gif">Strike</option>
<option value="Cereal7.gif">Fruity Pops</option>
</select>
<br />
<br />
<input id="Submit1" type="submit" runat="server" value="Apply"
onserverclick="SubmitBtn_Click" />
</form>
</body>
</html>