SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    SitePoint Member
    Join Date
    Mar 2011
    Posts
    7
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    checkbox validation

    I need to validate the checkbox with js, if it's checked the form proceeds with the submit, if not it triggers the alert

    Right now I have this (which worked perfect with text input) but it doesn't work for a checkbox:

    HTML Code:
    <input type="checkbox" name="Terms">I agree to the terms and conditions*</input>
    
    function validateTerms(field) {
    	if (field == "") return "You must agree to the terms and conditions.\\n"
    	return ""
    }
    I've tried using logic like this in my if statement "field != document.form.Terms.Checked" and an onclick in the input but with
    no success.

    I also want the same thing but with a dropdown menu.

    Any help would be much appreciated!

  2. #2
    SitePoint Enthusiast
    Join Date
    Mar 2011
    Location
    Bs. As. - Argentina
    Posts
    35
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi, assuming "field" is a refence to the "checkbox input" the if clause should be like that

    Code JavaScript:
    function validateTerms(field) {
    	if (!field.checked) {
                return "You must agree to the terms and conditions.\\n"
            }
    	return ""
    }

    Note the ! sign for testing the false state.

    See you

  3. #3
    SitePoint Member
    Join Date
    Mar 2011
    Posts
    7
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi, thanks! I tried that and the alert comes up, but right now it isn't recognizing when I actually check the box and it still comes up.

  4. #4
    SitePoint Enthusiast
    Join Date
    Mar 2011
    Location
    Bs. As. - Argentina
    Posts
    35
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ok, can you put some more code to see the whole picture

    See you

  5. #5
    SitePoint Member
    Join Date
    Mar 2011
    Posts
    7
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi the whole thing is rather big but hopefully these bits are a good indication. Thanks!

    HTML Code:
    $Title = $FirstName = $LastName = $EmailFrom = $Terms = "";
    
    if (isset($_POST['Title']))
    	$Title = fix_string($_POST['Title']);
    if (isset($_POST['FirstName']))
    	$FirstName = fix_string($_POST['FirstName']);
    if (isset($_POST['LastName']))
    	$LastName = fix_string($_POST['LastName']);
    if (isset($_POST['EmailFrom']))
    	$EmailFrom = fix_string($_POST['EmailFrom']);
    if (isset($_POST['Terms']))
    	$Terms = fix_string($_POST['Terms']);
    
    $fail  = validate_Title($Title);
    $fail .= validate_FirstName($FirstName);
    $fail .= validate_LastName($LastName);
    $fail .= validate_EmailFrom($EmailFrom);
    $fail .= validate_Terms($Terms);
    
    
    
    
    $Terms = Trim(stripslashes($_POST['Terms']));
    
    
    
    
    function validate(form)
    {
    	fail = validateTitle(form.Title.value)
    	fail += validateFirstName(form.FirstName.value)
    	fail += validateLastName(form.LastName.value)
    	fail += validateEmailFrom(form.EmailFrom.value)
    	fail += validateTerms(form.Terms.value)
    	if (fail == "") return true
    	else { alert(fail); return false }
    }
    
    
    
    
    	  <form method="POST" class="enquiry-form" action="adduser2.php" onSubmit="return validate(this)">	
    
    		  <input name="FirstName" type="text" size="40">		
    
    		<input type="checkbox" name="Terms" value="Yes">I have read and agree to the terms and conditions*</input>
    
    	</form>
    
    
    
    
    function validateTerms(field) {
    	if (!field.checked) {
                return "You must agree to the terms and conditions.\\n"
            }
    	return ""
    }

  6. #6
    SitePoint Enthusiast
    Join Date
    Mar 2011
    Location
    Bs. As. - Argentina
    Posts
    35
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The problem is that you are passing the value, not the whole object

    Code JavaScript:
    function validate(form)
    {
    	fail = validateTitle(form.Title.value)
    	fail += validateFirstName(form.FirstName.value)
    	fail += validateLastName(form.LastName.value)
    	fail += validateEmailFrom(form.EmailFrom.value)
    // Value only, not the object.
    //	fail += validateTerms(form.Terms.value)
    //     instead use, without the ".value"
    	fail += validateTerms(form.Terms)
    	if (fail == "") return true
    	else { alert(fail); return false }
    }

    The value of the object "Terms" is set to the string "yes", so when you pass "yes" instead of the object you got a String object that do not has a "checked" property and then the "if (!field.checked)" will every time evaluate to true, cause the if is in negative way.

    So, a big confusion here

    See you

  7. #7
    SitePoint Member
    Join Date
    Mar 2011
    Posts
    7
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    That's brilliant! Thank you. Yes that was a bit of a mix up, haha. Also got the dropdown/select working which is great.

    Thanks again!
    gp


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
  •