Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations MikeeOK on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

How do I dynamically evaluate a static group of checkboxes 2

Status
Not open for further replies.

LyndonOHRC

Programmer
Sep 8, 2005
603
US
I am ready to validate several inputs just before my action page executes.

On this page I have 14 checkboxes for our most common transaction types. Additionally I have a select that contains the rest of them.

I already have JS functions that makes sure only one checkbox or a dropdown is selected; that all works great.

Now for final validation I need to make sure that one of the checkboxes is selected or one of the, non-blank, rows in the dropdown is selected.

I was hoping not to strictly reference the checkbox names so I could add or edit them later without needing to modify the validation script. Ultimately I’d like to have them in a database maintained by an application administrator.

I used a naming convention hoping there would be a way to loop through them and determine if at least one is checked.

Note: there are other checkboxes on the form, with dissimilar names, that are not involved with this validation.


Code:
<form method="post" action="MyActionPage.cfm" onsubmit="return (IsLicenseTypeSelected())">
	....way too many html form elements.....
	
<input type="submit" value="Print Preview"/>
</form>

<script type="text/javascript">
	Function IsLicenseTypeSelected()
		{
			//if dropdown is not blank
			if (document.forms['ReceiptForm'].elements['LicenseTypeOther'].selectedIndex  > 0)
			{
				//I would like to loop throught these 
				//and return true if one of them is checked
				//and/or return false if  none are checked
				//Convention: "document.ReceiptForm.cb*" 
				document.ReceiptForm.cbOwner;
				document.ReceiptForm.cbMutuel;
	    		document.ReceiptForm.cbFingerprint;
				document.ReceiptForm.cbTrainer;
				document.ReceiptForm.cbFoodSvc;
				document.ReceiptForm.cbReplacementBadge;
				document.ReceiptForm.cbOwnerTrainer;
				document.ReceiptForm.cbSecurity;
				document.ReceiptForm.cbSpouse;
				document.ReceiptForm.cbJockey;
				document.ReceiptForm.cbCleaningSvc;
				document.ReceiptForm.cbOther;
				document.ReceiptForm.cbGroom;
				document.ReceiptForm.cbAdministrative
			}
			return true;
		}
		
</script>
 
This will check all the checkboxes on the page that have a name that starts with "cb". If even one is found checked, it will return true:

Code:
<script type="text/javascript">
   //make sure to put a lowercase F for the word function
   function IsLicenseTypeSelected() {
      //if dropdown is not blank
      if (document.forms['ReceiptForm'].elements['LicenseTypeOther'].selectedIndex  > 0) {
         //I would like to loop throught these
         //and return true if one of them is checked
         //and/or return false if  none are checked
         //Convention: "document.ReceiptForm.cb*"
         var inputs = document.getElementsByTagName("input");
         var booleanReturnValue = false;
         for (var i = 0; i < inputs.length; i++) {
            if (inputs[i].type == "checkbox" && inputs[i].name.substr(0, 2) == "cb") {
               booleanReturnValue = (booleanReturnValue || inputs[i].checked);
            }
         }
         return booleanReturnValue;
      }
      //we return true otherwise?
      return true;
   }
</script>

-kaht

[small] <P> <B> <P> <B> <P> <B> <P> <B> <P> <B> <P> <B> <P> <B> <P> <B> <P> <B> <P> <B> <P> <B> <P> <B> <P> <B> <P> <.</B>[/small]
[banghead] [small](He's back)[/small]
 
Code:
[COLOR=red yellow]
//we return true otherwise?
      return true;
[/color]

My intention is to return true if selectedIndex > 0; no need to evaluate the checkboxes. If checkboxes are evaluated I need to return false if none are checked/true if any are checked.

Is that what this accomplishes? It will take me some time to master the code you offered; it has several new concepts for me read up on.

Thanks
Lyndon



 
My intention is to return true if selectedIndex > 0;
.
.
.
Is that what this accomplishes?

That's correct.

It will take me some time to master the code you offered
Here it is in a nutshell:
Code:
   function IsLicenseTypeSelected() {
      //if dropdown is not blank
      if (document.forms['ReceiptForm'].elements['LicenseTypeOther'].selectedIndex  > 0) {

[i][gray]//this pulls every [b]<input .....>[/b] form element on the page and puts them in an array[/gray][/i]

         var inputs = document.getElementsByTagName("input");

[i][gray]//this sets the initial return value to false (which is what 
//we return if we find nothing)[/gray][/i]

         var booleanReturnValue = false;

[i][gray]//this will loop thru every input element on the page[/gray][/i]

         for (var i = 0; i < inputs.length; i++) {

[i][gray]//this checks to ensure the <input> that we are evaluating
//is a checkbox [b]AND[/b] has a name that starts with "cb"[/gray][/i]

            if (inputs[i].type == "checkbox" && inputs[i].name.substr(0, 2) == "cb") {

[i][gray]//if we determined that we're looking at a checkbox then
//we use boolean algebra to modify the return value:
// true  || true  = true
// true  || false = true
// false || true  = true
// false || false = false
//so, essentially once we find a box that is checked, we set booleanReturnValue
//equal to true, and as you can see in the above chart, when using the logical
//or operator, any time you have true in the equation, the result is always true
//for us, this means once we've found a checkbox we want to return true, so 
//using || ensures it never becomes false again[/gray][/i]

               booleanReturnValue = (booleanReturnValue || inputs[i].checked);
            }
         }
         return booleanReturnValue;
      }
      //we return true otherwise?
      return true;
   }

-kaht

[small] <P> <B> <P> <B> <P> <B> <P> <B> <P> <B> <P> <B> <P> <B> <P> <B> <P> <B> <P> <B> <P> <B> <P> <B> <P> <B> <P> <.</B>[/small]
[banghead] [small](He's back)[/small]
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top