topical media & game development
[] readme course(s) preface I 1 2 II 3 4 III 5 6 7 IV 8 9 10 V 11 12 afterthought(s) appendix reference(s) example(s) resource(s) _

talk show tell print

basic-web-html-12-exercise1.htm / htm



  <html>
  <head>
    <title>Example 1</title>
    <style type="text/css">
      .formTitle {vertical-align:top; text-align:right;}
    </style>
  
  <script type="text/JavaScript">
  
    function validate(form) {
      var returnValue = true
  
      var name=form.txtName.value
      if (name=="")
        {
          returnValue = false;
          alert("You must enter a name")
          document.frmCompetition.txtName.focus();
        }
  
      var email=form.txtEmail.value
      var rxEmail = /^\w(\.?[\w-])*@\w(\.?[\w-])*\.[a-z]{2,6}(\.[a-z]{2})?/i;
  
      if (!rxEmail.test(email))
        {
          returnValue = false;
          alert("You must enter a valid email address")
          document.frmCompetition.txtEmail.focus()
        }
  
      var radioChosen = false;
      var radioButtons = form.radAnswer;
      for (var i=0; i<radioButtons.length; i++) {
      if (radioButtons[i].checked)
        {
        radioChosen=true;
        }
      }
  
      if (radioChosen == false) {
        returnValue = false;
        alert("You did not answer the question");
      }
  
      var tieBreaker=form.txtTieBreaker.value
      var tieBreakerWords = tieBreaker.split(/\s+/g);
      wordCount = tieBreakerWords.length;
  
      if (tieBreaker=="")
        {
          returnValue = false;
          alert("You must enter an answer for the tie breaker")
          document.frmCompetition.txtTieBreaker.focus();
        }
  
      if (wordCount > 20) {
        returnValue = false;
        alert("Your tie breaker answer must be no more than 20 words. You entered "+ wordCount+ "words.");
        document.frmCompetition.txtTieBreaker.focus();
      }
  
      return returnValue
    }    
  
    </script>
  
  </head>
  <body>
  
  <form name="frmCompetition" action="basic-web-html-12-competition.asp" method="post" onsubmit="return validate(this);">
  <h2>An Example Competition Form <br />(Sorry, there are no real prizes!)</h2>
  <p>To enter the drawing to win a case of Jenny's Jam, first answer
  this question: "What color are strawberries?" Then provide an answer for
  the tie-breaker question: "I would like to win a case of Jenny's Jam
  because..." in no more than 20 words.</p>
  <table>
    <tr>
      <td class="formTitle">Name: </td>
      <td><input type="text" name="txtName" size="18" /></td>
    </tr>
    <tr>
      <td class="formTitle">Email: </td>
      <td><input type="text" name="txtEmail" size="18" /></td>
    </tr>
    <tr>
      <td class="formTitle">Answer: </td>
      <td><input type="radio" name="radAnswer" value="Red" /> Red<br />
            <input type="radio" name="radAnswer" value="Gray" /> Gray<br />
            <input type="radio" name="radAnswer" value="Blue" /> Blue
      </td>
    </tr>
    <tr>
      <td class="formTitle">Tie breaker <br/ ><small>(no more than 20 words)</small>: </td>
      <td><textarea name="txtTieBreaker" cols="30" rows="3" /></textarea></td>
    </tr>
    <tr>
      <td class="formTitle"></td>
      <td><input type="submit" value="Enter now"  /></td>
    </tr>
  </table>
  
  </form>
  
  </body>
  </head>
  </html>
[] readme course(s) preface I 1 2 II 3 4 III 5 6 7 IV 8 9 10 V 11 12 afterthought(s) appendix reference(s) example(s) resource(s) _

(C) Æliens 20/2/2008

You may not copy or print any of this material without explicit permission of the author or the publisher. In case of other copyright issues, contact the author.