SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Member
    Join Date
    Feb 2002
    Posts
    8
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    How to not submit form if not valid?

    I have added some Javascript to validate a form. I want users to choose exactly 9 selection from a list of 11 checkboxes. When they click more than 9, on the 10th click a Javascript alert comes up. (This is working fine.) Next I want to have an alert come up if a user clicks submit and has chosen less than 9. The alert is coming up but instead of staying on the form, it submits it.

    How do I get the alert to come up without submitting the form?

    Here is the code I've been using:

    javascript:

    Code:
      <script type="text/javascript" language="javascript"> 
     var freeItemCount=0 
     var maxFreeItems=9 
     
     function setItems(item)
     { 
       if(item.checked)
       {freeItemCount=freeItemCount+1}
     
     else
      {freeItemCount=freeItemCount-1} 
     
     if (freeItemCount>maxFreeItems)
       {item.checked=false 
       freeItemCount=freeItemCount-1 
     alert('You may only choose '+maxFreeItems+' selections. Please choose the '+maxFreeItems+' selections you want us to include ') 
       } 
     } 
     
     function setItems2(item)
     { 
     
     
     if (freeItemCount < maxFreeItems)
       { 
       alert("You have chosen too few");
       return false;
       } 
     
     } 
     
     </script>
    Here is the HTML for the form:

    Code:
      <form method="post" name="take_survey" onsubmit="setItems2(this)" action="xt_survey_key9.htm">
     
      <input type="checkbox" onclick="setItems(this)" name="q4751[]" value="12564">  Sally Bair<BR>
     <input type="checkbox" onclick="setItems(this)" name="q4751[]" value="12565">  Amy Perry DelCorvo<BR>
     <input type="checkbox" onclick="setItems(this)" name="q4751[]" value="12566">  Michael Golden<BR>
     <input type="checkbox" onclick="setItems(this)" name="q4751[]" value="12567">  Don Hall<BR>
     <input type="checkbox" onclick="setItems(this)" name="q4751[]" value="12568">  Michael Hall<BR>
     <input type="checkbox" onclick="setItems(this)" name="q4751[]" value="12569">  Sharnell Jackson<BR>
     <input type="checkbox" onclick="setItems(this)" name="q4751[]" value="12570">  Bob Moore<BR>
     <input type="checkbox" onclick="setItems(this)" name="q4751[]" value="12571">  John Q. Porter<BR>
     <input type="checkbox" onclick="setItems(this)" name="q4751[]" value="12572">  Barbara Stein<BR>
     <input type="checkbox" onclick="setItems(this)" name="q4751[]" value="12573">  Bev White<BR>
     <input type="checkbox" onclick="setItems(this)" name="q4751[]" value="12574">  Steve Zsiray<BR>
     
     <input type="submit" name="submit" value="Submit Survey"><!--<input type="submit" name="submit" value="Cancel">-->
     </center>
     </FORM>
    Thanks so much in advance.

  2. #2
    SitePoint Enthusiast
    Join Date
    Sep 2005
    Posts
    32
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Try this change

    <form method="post" name="take_survey" onsubmit="return setItems2(this)" action="xt_survey_key9.htm">

  3. #3
    SitePoint Addict
    Join Date
    Nov 2005
    Posts
    327
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    As a general rule, a validator should return false if the form fails validation and true if it passes. As torunforever suggests, your form's onsubmit handler should return the boolean value returned by the validator.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •