<html> <head> <title>Forms Page</title> <style type="text/css"> body,td,input,textarea { font-family: Tahoma; font-size: x-small; } td.prop { text-align: right; padding-right: 8px; vertical-align: top; font-weight: bold; padding-top: 3px; } .formElement { width: 300px; } .button { width: 80px; } </style> <script type="text/javascript"> function submitForm() { var name = document.getElementById("name").value; var age = document.getElementById("age").value; var address = document.getElementById("address").innerHTML; var message = ""; if (name == "") message += "Please enter your name"; if (age == "") message += "\nPlease enter your age"; if (address == "") message += "\nPlease enter your address"; if (message == "") { // allow the form to be submitted return true; } else { // error messages exist alert(message); return false; } } </script> </head> <body> <h2>Forms Test</h2> <p align="center"> <form action="thankyou.html" onSubmit="return submitForm();"> <table> <tr> <td class="prop">Name:</td> <td><input type="text" name="name" id="name" class="formElement" /></td> </tr> <tr> <td class="prop">Age:</td> <td><input type="text" name="age" id="age" class="formElement" /></td> </tr> <tr> <td class="prop">Address:</td> <td><textarea name="address" id="address" class="formElement" rows="4"></textarea></td> </tr> <tr> <td colspan="2" align="right"> <input type="submit" value="Send" class="button" /> </td> </tr> </table> </form> </p> </body> </html>