SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    SitePoint Addict
    Join Date
    Jun 2007
    Posts
    396
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    Really basic checkbox validation?

    Hi,

    I want some code that'll check if the user has selected an input on a checkbox, if the user has, process the form, else return false and give them an onscreen alert (probably change to something more user-friendly later on, but anyway)

    My checkbox looks similar to this:

    Code HTML:
    				<input type="checkbox" name="tobeaddressed[]" value="Whatever" id="Whatever"><label for="Whatever">Whatever</label><br>
    				<input type="checkbox" name="tobeaddressed[]" value="Another checkbox" id="Another checkbox"><label for="Another checkbox">Another checkbox</label><br>
    				<input type="checkbox" name="tobeaddressed[]" value="And another" id="And another"><label for="And another">And another</label><br>
    				<input type="checkbox" name="tobeaddressed[]" value="Final one" id="Final one"><label for="Final one">Final one</label><br>

    And the Javascript...
    Code JAVASCRIPT:
    checkBoxes(document.form.tobeaddressed);
    function checkBoxes(checks) {
    	for(i=0;i<checks.length;i++) {
    		if (checks[i].checked) { return true }
    		else { alert('Please selected...'); return false }
    	}
    }

    At the moment it's saying: "checks has no properties" - it does the same if I move it outside of a function and declare document.form.tobeaddressed from the start.

    Any help would be ace, cheers

  2. #2
    From Italy with love silver trophybronze trophy
    guido2004's Avatar
    Join Date
    Sep 2004
    Posts
    9,506
    Mentioned
    163 Post(s)
    Tagged
    4 Thread(s)
    document.form.tobeaddressed
    You have no form of that name.

  3. #3
    SitePoint Addict
    Join Date
    Jun 2007
    Posts
    396
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Thanks for the reply, I forgot to post the form information originally but it did have a name of 'form' (pretty creative huh?)

    I've just changed it to...

    <form name="development" method="post" onSubmit="return checkInitial()">

    And my code to...

    checkBoxes(document.development.tobeaddressed);

    But unfortunately I'm still having the same error.

  4. #4
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    Try using checkBoxes(document.development['tobeaddressed[]'])

    Also, you may not want to perform a negative behaviour on the checkboxes until after all of the checkboxes have been tested, but no doubt you'll come to that issue shortly after you manage to address them.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  5. #5
    SitePoint Addict
    Join Date
    Jun 2007
    Posts
    396
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Ah, that's excellent, thanks pmw57!

    My Javascript currently looks a little like this...
    Code JAVASCRIPT:
    return checkBoxes(document.development['tobeaddressed[]']);
     
    function checkBoxes(checks) {
    	for(i=0;i<checks.length;i++) {
    		if (!checks[i].checked) { alert('Please check!'); }
    	}
    	return false;
    }

    But as you said, it's far from ideal ^ Would I be better off using a flag? So something like...

    Code JAVASCRIPT:
    function checkBoxes(checks) {
    	for(i=0;i<checks.length;i++) {
    		if (checks[i].checked) { var ischecked = "Y" }
    	}
    	if (ischecked == "Y") { return true; }
    	else {alert('Please select an area to be addressed'); return false}
    }
    But that seems to submit the form regardless, bah. Is it possible to have two returns in a function? If that makes any sense...

  6. #6
    SitePoint Addict
    Join Date
    Jun 2007
    Posts
    396
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Hang on, this seems to be working just fine:

    Code JAVASCRIPT:
    if(!checkBoxes(document.development['tobeaddressed[]'])) {alert("Please select an area (or multiple areas) to be addressed. Thank you"); return false};
     
    function checkBoxes(checks) {
    	for(i=0;i<checks.length;i++) {
    		if (checks[i].checked) { var ischecked = "Y" }
    	}
    	if (ischecked == "Y") { return true; }
    	else { return false; }
    }

    Look okay? Thanks again

  7. #7
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    Yes, that's better. How about this shortened version?

    Code javascript:
    function checkBoxes(checks) {
        for(i=0; i<checks.length; i++) {
            if (checks[i].checked) {
                return true;
            }
        }
        return false;
    }
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  8. #8
    SitePoint Addict
    Join Date
    Jun 2007
    Posts
    396
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    That's working an absolute treat, thank you so much! I actually did something like that originally; had it returning either true or false, but instead of putting if(function) I had if(function == true) which made me re-work what it returned, and then back again... and generally got myself into a bit of a mess

    Thanks again


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
  •