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 Rhinorhino on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Validate Checkboxes 1

Status
Not open for further replies.

arpan

Programmer
Joined
Oct 16, 2002
Messages
336
Location
IN
I am creating checkboxes in an HTML Form using a dynamic loop (for which I am using ASP). Since it is dynamic, I am not aware of how many checkboxes will be ultimately present when the user submits the Form. The name & the value of these checkboxes is "contact" followed by a unique ID i.e. each checkbox will have a unique name & value. Examples of these checkboxes can be something like this:

<input type=checkbox name=&quot;contact89&quot; value=&quot;contact89&quot;>
<input type=checkbox name=&quot;contact234&quot; value=&quot;contact234&quot;>
<input type=checkbox name=&quot;contact6&quot; value=&quot;contact6&quot;>
<input type=checkbox name=&quot;contact111&quot; value=&quot;contact111&quot;>

As you can see, the name & the value are unique for each checkbox but both name & value of all the checkboxes are preceded by 'contact'. While coding, I am only aware that the name & value are preceded by 'contact' but I don't know the ID of the checkboxes which makes it unque. How do I validate that only one checkbox is checked when the user submits the Form? Also if there is one & only one checkbox, how do I validate that that checkbox is checked?

Thanks,

Arpan
 
the first issue if I read correctly in not knowing the complete name of the checkbox is really a fairly simple using the indexOf function
syntax would be
if(document.forms[0].elements[x].name.indexOf(&quot;contact&quot;))

this equating to true/false if contact is found in the name of the form element.
If I was doing this I think to make things clean I would jsut loop through the form with that search criteria and increnet a counter. on the conditional if being true inremcent the counter and a final check for the value of the counter being the validation of how many boxes were checked.
if the counter >1 then you have more checkboxs with the string in the name &quot;contact&quot; checked.

____________________________________________________
The most important part of your thread is the subject line.
Make it clear and about the topic so we can find it later for reference. Please!! faq333-2924

onpnt2.gif
 
Can you please show me how it could be done? I would be highly obliged if you could do that i.e. provide the source code. My JavaScript is not very strong. Also I want that when a user clicks one checkbox, a hidden field value should be equal to the value of the checked checkbox.

Thanks,

Regards,

Arpan
 
<script language=&quot;javascript&quot;>
/* this is a crude example but should get you off in the
right direction. There should only be two values you need to
validate. one=&quot;contact&quot; is in the name and two=the checkbox is checked
*/
function valChk() {

/* declare variables to be used in the conditional statments
first var is your increment varaible
second var is the form object
in this case forms[0] is the first form found in the page.
if you had two forms and wanted to direct to the second listed
forms[1] would be used
*/
var cnt = 0;
var elem = document.forms[0];

/*now the loop through all the form objects. you could
further this with a type check for checkbox.
eg:elem.elements[x].type ==&quot;checkbox&quot;
*/
for(x = 0; x < document.forms[0].length; x++)
//check for the index of contact and the checked condition = true
if((elem.elements[x].name.indexOf(&quot;contact&quot;)>=0) && (elem.elements[x].checked==true)) {
//if checked returns true incrememnt the counter
cnt += 1
}
//final check for the length of the counter. if it's > 1 then more
//then one box was checked
if(cnt>1) {
window.alert(&quot;Only one box may be checked!&quot;);
return false;
}

}
</script>

the form
<form>
<input type=&quot;checkbox&quot; name=&quot;contact89&quot; value=&quot;contact89&quot;>
<input type=&quot;checkbox&quot; name=&quot;contact234&quot; value=&quot;contact234&quot;>
<input type=&quot;checkbox&quot; name=&quot;contact6&quot; value=&quot;contact6&quot;>
<input type=&quot;checkbox&quot; name=&quot;contact111&quot; value=&quot;contact111&quot;>
<input type=&quot;button&quot; value=&quot;test&quot; onClick=&quot;return valChk()&quot;>
</form>

I'm sure theres a faster more efficient way but the task is fairly simplified. if the form is lengthy you may want to add the type condition being checkbox. this will take out itereating through non-needed form objects.
I tested with IE5.5+ and NN6.2+

____________________________________________________
The most important part of your thread is the subject line.
Make it clear and about the topic so we can find it later for reference. Please!! faq333-2924

onpnt2.gif
 
also the hidden form field task just add a condition to give that value to the hidden field
eg:
hidden field = elem.value

____________________________________________________
The most important part of your thread is the subject line.
Make it clear and about the topic so we can find it later for reference. Please!! faq333-2924

onpnt2.gif
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top