1 / 14

HTML Server Controls ASP.NET

HTML Server Controls ASP.NET. Please see speaker notes for additional information!. <html> <head> <title>Loading a Page</title> <script runat="server"> Sub Page_Load linkCIS.HRef="http://www.pgrocer.net/PFGCIS47.html" End Sub </script> </head> <body> <form runat="server">

nelson
Download Presentation

HTML Server Controls ASP.NET

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. HTML Server ControlsASP.NET Please see speaker notes for additional information!

  2. <html> <head> <title>Loading a Page</title> <script runat="server"> Sub Page_Load linkCIS.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> Output - when I click on the link I go to the specified address. Code I wrote . Code that got generated and executed. <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>

  3. <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 Sub Sub buttonCIS45(Source As Object, e As EventArgs) CIS.InnerHtml="You are taking Introduction to Java for Internet Developers!" End Sub Sub 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.

  4. <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>

  5. <html> <head><title>Table</title> <script runat="server"> Sub runSum(sender As Object, e As EventArgs) dim r,c dim tot for r=1 To 3 for c=0 To 2 tot = tot + int(tableAdd.Rows(r).Cells(c).InnerHtml) next next SUM.InnerHtml = "The total is " & tot End Sub </script> </head> <body> <form runat="server"> <table id="tableAdd" border="1" runat="server"> <tr> <td>&nbsp;First&nbsp;</td><td>&nbsp;Second&nbsp;</td> <td>&nbsp;Third&nbsp;</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>

  6. <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>&nbsp;First&nbsp;</td> <td>&nbsp;Second&nbsp;</td> <td>&nbsp;Third&nbsp;</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.

  7. <html> <head><title>Flip image</title> <script runat="server"> Sub choose_image(Sender As Object, e As EventArgs) CISimg.Src = pickImage.Value End 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> When the subroutine is executed CISimg.Src is shown with the value selected in pickImage. This sets up the two options with id pickImage. OnServerClick I will execute the subroutine called choose_image. Initially the right side image (CISa.gif) is shown.

  8. <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>

  9. <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>

  10. <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 if End 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.

  11. <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>

More Related