Exercise 1 Write the HTML codes to display
- Slides: 11
Exercise 1 Write the HTML codes to display the following form. Pay attention to the neat presentation of this form. 1
Solution <html> <head> <title>Java. Script On. Line Form</title> </head> <body> <form name=myorder> <table border> <th>Item <th>Unit Price <th>Quantity <th>Total Price <th>Add To Cart </tr> 2
<tr> <td>Apple <td>0. 50 <td><input type=text size=15 name=appqty value=""> <td><input type=text size=15 name=appprice value=""> <td><input type=button name=addcart value="BUY IT!"> </tr> <td>Orange <td>0. 60 <td><input type=text size=15 name=ornqty value=""> <td><input type=text size=15 name=ornprice value=""> <td><input type=button name=addcart value="BUY IT!"> </tr> 3
<tr> <td>Mango <td>1. 85 <td><input type=text size=15 name=manqty value=""> <td><input type=text size=15 name=manprice value=""> <td><input type=button name=addcart value="BUY IT!"> </tr> </table> <p> <input type=submit value="Send Order Now"> <input type=reset value="Clear Order"> </form> </body> </html> 4
Exercise 2 Write the HTML codes for this simple quiz form. 5
Solution <html> <head> <title>Online Test</title> </head> <body> <center> <h 3>WELCOME TO ONLINE TEST</h 3> </center> <hr> <form name="mcq" method=post action="mailto: abc@abc. com"> Q 1) What is 10 + 10 ? <input type=radio name="qn 1">10 <input type=radio name="qn 1">20 <input type=radio name="qn 1">30 6
<p> Q 2) What is 20 * 5 ? <input type=radio name="qn 2">100 <input type=radio name="qn 2">25 <input type=radio name="qn 2">125 <p> Q 3) What is 100 - 20 ? <input type=radio name="qn 3">120 <input type=radio name="qn 3">119 <input type=radio name="qn 3">80 <p> <input type=button value="Check Score" > <input type=submit value="SEND"> <input type=reset value="CLEAR"> <p> </body> 7 </html>
Exercise 3 Write HTML codes for this simple registration form. 8
Solution <html> <head> <title>Form Exercises</title> </head> <body> <center><h 3>Online Registration</h 3></center> <hr> <form name="online_reg"> First Name : <input type=text size=15 name="fname"> Last Name : <input type=text size=15 name="lname"> Date of birth : <input type=text size=10 name="dob"> Email address : <input type=text size=25 name="email"> 9
Country of birth <select name="country"> <option>Singapore <option>Malaysia <option>India <option>Hong Kong <option>Brunei <option>Thailand <option>Indonesia </select> Race <select name="race"> <option>Indian <option>Chinese <option>Malay <option>Others </select> <p> 10
<textarea rows=5 cols=30> Enter your comments here </textarea> </form> </body> </html> 11