HTML Server Controls ASP.NET
14
HTML Server Controls ASP.NET Please see speaker notes for additional information!
description
HTML Server Controls ASP.NET. Please see speaker notes for additional information!. Loading a Page Sub Page_Load linkCIS.HRef="http://www.pgrocer.net/PFGCIS47.html" End Sub - PowerPoint PPT Presentation
Transcript of HTML Server Controls ASP.NET
HTML Server ControlsASP.NET
Please see speaker notes for additional information!
<html><head><title>Loading a Page</title><script runat="server">Sub Page_LoadlinkCIS.HRef="http://www.pgrocer.net/PFGCIS47.html"End Sub</script></head><body><form runat="server"><a id="linkCIS" runat="server">CIS47 web site!</a></form></body></html>
<html><head><title>Loading a Page</title>
</head><body><form name="_ctl0" method="post" action="link1.aspx" id="_ctl0"><input type="hidden" name="__VIEWSTATE" value="dDwtMjExODUwMzk and more… HDW/GWT1g==" />
<a href="http://www.pgrocer.net/PFGCIS47.html" id="linkCIS">CIS47 web site!</a></form></body></html>
Code I wrote .
Code that got generated and executed.
Output - when I click on the link I go to the specified address.
<html><head><title>Using a Button HTML Server Control</title></head><script runat="server">Sub buttonCIS44(Source As Object, e As EventArgs) CIS.InnerHtml="You are taking Internet User/Developer"End SubSub buttonCIS45(Source As Object, e As EventArgs) CIS.InnerHtml="You are taking Introduction to Java for Internet Developers!"End SubSub buttonCIS47(Source As Object, e As EventArgs) CIS.InnerHtml="You are taking Interactive Web Sites!"End Sub</script></head><body style="color:brown; font-size:14 pt; font-weight:bold"><h2>Please click a button to get the name of the course</h2><form runat="server"><button id="CIS44" OnServerClick="buttonCIS44"style="color:green; background-color:beige; height=20;width:75" runat="server">CIS44</button><button id="CIS45" OnServerClick="buttonCIS45"style="color:green; background-color:beige; height=20;width:75" runat="server">CIS45</button><button id="CIS47" OnServerClick="buttonCIS47"style="color:green; background-color:beige; height=20;width:75" runat="server">CIS47</button><p id="CIS" runat="server" /></form></body></html>
Describes the buttons on the form. Note that the color, size and text on the button are specified.
<html><head><title>Using a Button HTML Server Control</title></head>
</head><body style="color:brown; font-size:14 pt; font-weight:bold"><h2>Please click a button to get the name of the course</h2><form name="_ctl0" method="post" action="button.aspx" id="_ctl0"><input type="hidden" name="__EVENTTARGET" value="" /><input type="hidden" name="__EVENTARGUMENT" value="" /><input type="hidden" name="__VIEWSTATE" value="dDwxOTYzNjc5…more code...Ucgz2VeSdEK6pAFw==" />
<script language="javascript"><!--
function __doPostBack(eventTarget, eventArgument) {var theform = document._ctl0;theform.__EVENTTARGET.value = eventTarget;theform.__EVENTARGUMENT.value = eventArgument;theform.submit();
}// --></script><button language="javascript" onclick="__doPostBack('CIS44','')" id="CIS44" style="color:green; background-color:beige; height=20;width:75">CIS44</button><button language="javascript" onclick="__doPostBack('CIS45','')" id="CIS45" style="color:green; background-color:beige; height=20;width:75">CIS45</button><button language="javascript" onclick="__doPostBack('CIS47','')" id="CIS47" style="color:green; background-color:beige; height=20;width:75">CIS47</button><p id="CIS">You are taking Internet User/Developer</p></form></body></html>
Note that this code is after I clicked on the CIS44 button. When I look at the code after clicking the CIS47 button, I see the following:
<p id="CIS">You are taking Interactive Web Sites!</p>
<html><head><title>Table</title><script runat="server">Sub runSum(sender As Object, e As EventArgs)dim r,cdim totfor r=1 To 3 for c=0 To 2 tot = tot + int(tableAdd.Rows(r).Cells(c).InnerHtml) nextnextSUM.InnerHtml = "The total is " & totEnd Sub</script></head><body><form runat="server"><table id="tableAdd" border="1" runat="server"> <tr> <td> First </td><td> Second </td> <td> Third </td> </tr> <tr> <td>1</td><td>2</td><td>3</td> </tr> <tr> <td>4</td><td>5</td><td>6</td> </tr> <tr> <td>7</td><td>8</td><td>9</td> </tr></table><br /><input type="button" value="Sum" OnServerClick=”runSum" runat="server"/><p id=SUM runat="server" /></form></body></html>
<html><head><title>Table</title>
</head><body><form name="_ctl0" method="post" action="table.aspx" id="_ctl0"><input type="hidden" name="__EVENTTARGET" value="" /><input type="hidden" name="__EVENTARGUMENT" value="" /><input type="hidden" name="__VIEWSTATE" value="dDw0NDY2NzY…more data...N9QCixjzFqDSxey32AupKVX4Q==" />
<script language="javascript"><!--
function __doPostBack(eventTarget, eventArgument) {var theform = document._ctl0;theform.__EVENTTARGET.value = eventTarget;theform.__EVENTARGUMENT.value = eventArgument;theform.submit();
}// --></script><table id="tableAdd" border="1">
<tr><td> First </td><td> Second </td><td> Third </td>
</tr><tr>
<td>1</td><ttd>2</td><ttd>3</td></tr><tr>
<td>4</td><td>5</td><td>6</td></tr><tr>
<td>7</td><td>8</td><td>9</td></tr>
</table>
<br /><input language="javascript" onclick="__doPostBack('_ctl17','')" name="_ctl17" type="button" value="Sum" /><p id="SUM">The total is 45</p></form></body></html> Note the total after the calculation is done.
<html><head><title>Flip image</title><script runat="server">Sub choose_image(Sender As Object, e As EventArgs) CISimg.Src = pickImage.ValueEnd Sub</script></head><body><form runat="server"><select id="pickImage" runat="server"> <option value="CISa.gif">Right side up</option> <option value="CISb.gif">Upside down</option></select><input type="submit" runat="server" value="Display image"OnServerClick="choose_image"><br /><br /><img id="CISimg" src="CISa.gif" runat="server" /></form></body></html>
This sets up the two options with id pickImage.
OnServerClick I will execute the subroutine called choose_image.
When the subroutine is executed CISimg.Src is shown with the value selected in pickImage.
Initially the right side image (CISa.gif) is shown.
<html><head><title>Flip image</title></head><body><form name="_ctl0" method="post" action="flipimage.aspx" id="_ctl0"><input type="hidden" name="__VIEWSTATE" value="dDwtMTEyNT…more code...SzQicBL8ulujbTDbA=" />
<select name="pickImage" id="pickImage"><option selected="selected" value="CISa.gif">Right side up</option><option value="CISb.gif">Upside down</option>
</select><input name="_ctl1" type="submit" value="Display image" /><br /><br /><img src="/pgrocer/controlsbegin/CISa.gif" id="CISimg" /></form></body></html>
<html><head><title>Flip image</title>
</head><body><form name="_ctl0" method="post" action="flipimage.aspx" id="_ctl0"><input type="hidden" name="__VIEWSTATE" value=”more code...Pjs+Wha7FMoCrlXmFgcmxFpdkNa9iM4=" />
<select name="pickImage" id="pickImage"><option value="CISa.gif">Right side up</option><option selected="selected" value="CISb.gif">Upside down</option>
</select><input name="_ctl1" type="submit" value="Display image" /><br /><br /><img src="/pgrocer/controlsbegin/CISb.gif" id="CISimg" /></form></body></html>
<html><head><title>Flip image</title><script runat="server">Sub choose_image(Sender As Object, e As EventArgs) If right.Checked=True then CISimg.Src = "CISa.gif" else CISimg.Src = "CISb.gif" end ifEnd Sub</script></head><body><form runat="server"><input id="right" name="flip" type="radio" runat="server">Right side up</input><br /><input id="upside" name="flip" type="radio" runat="server">Upside down</input><input type="button" runat="server" value="Display image"OnServerClick="choose_image"><br /><br /><img id="CISimg" src="CISa.gif" runat="server" /></form></body></html>
This code sets up two radio buttons to use to determine whether you want to see the image right side up or upside down. When executed the subroutine checks to see if the first button with id=right is checked if so the image is displayed right side up, else it is displayed upside down.
<html><head><title>Flip image</title>
</head><body><form name="_ctl0" method="post" action="flipimage1.aspx" id="_ctl0"><input type="hidden" name="__EVENTTARGET" value="" /><input type="hidden" name="__EVENTARGUMENT" value="" /><input type="hidden" name="__VIEWSTATE" value="dDwxNTQzNj…more code...8kLuZp+rbfzlQBakC+ZQiYmmGE=" />
<script language="javascript"><!--
function __doPostBack(eventTarget, eventArgument) {var theform = document._ctl0;theform.__EVENTTARGET.value = eventTarget;theform.__EVENTARGUMENT.value = eventArgument;theform.submit();
}// --></script>
<input value="right" name="flip" id="right" type="radio" checked="checked" />Right side up</input><br /><input value="upside" name="flip" id="upside" type="radio" />Upside down</input><input language="javascript" onclick="__doPostBack('_ctl1','')" name="_ctl1" type="button" value="Display image" /><br /><br /><img src="/pgrocer/controlsbegin/CISa.gif" id="CISimg" /></form></body></html>
