/    Sign up×
Community /Pin to ProfileBookmark

Checkmark validation

Copy linkTweet thisAlerts:
Feb 17.2008

I would like to use JS to verify that at least one checkmark is selected. I will later verify using PHP, and therefore I would like to use a common name with brackets for all checkmarks. If I have the following html, how would I get the the three checkbox values (assuming checked) in a JS array? After that, I plan on just checking the length. Thanks

[code=html]<form id=”myform” name=”myform”>
<div id=”mydiv” name=”mydiv”>
check 1<input type=”checkbox” name=”mybox[]” id=”mybox[]” value=”2″ >
check 2<input type=”checkbox” name=”mybox[]” id=”mybox[]” value=”4″ >
check 3<input type=”checkbox” name=”mybox[]” id=”mybox[]” value=”6″ >
</div>
</form>[/code]

to post a comment
JavaScript

6 Comments(s) ↴

Copy linkTweet thisAlerts:
@JMRKERFeb 17.2008 — You cannot have non-unique ID values,

so create a hidden variable in the form that you can send to PHP code.
[code=php]
<form id="myform" name="myform">
<div id="mydiv" name="mydiv">
<input type="hidden" name='mybox[]' id='mybox' value="">
check 1<input type="checkbox" id="mybox1" value="2" >
check 2<input type="checkbox" id="mybox2" value="4" >
check 3<input type="checkbox" id="mybox3" value="6" >
</div>
</form>
[/code]
Before submission, check status and set hidden variable
[code=php]
// in <script>
var temp = '';
if (document.getElementById('mybox1').checked) { temp += '1'; }
if (document.getElementById('mybox2').checked) { temp += '2'; }
if (document.getElementById('mybox3').checked) { temp += '3'; }
document.getElementById('mybox').value = temp;
[/code]
I don't know much PHP so you might need to modify above further.

Good Luck! ?
Copy linkTweet thisAlerts:
@NotionCommotionauthorFeb 17.2008 — Thanks JMRKER,

You provided an intereresting approach. I was hoping, however, to keep it simpler for the sake of the php code. I thought that an id of an array without a key would allow JS to automatically assign a key like with php, but this is evidently not the case. As an alternatative, I can get ride of the ID's for each checkmark altogether, count the elements in the outer DIV, and check which ones are checked. Does this make sense?

Thanks
Copy linkTweet thisAlerts:
@JMRKERFeb 17.2008 — I have not tried that but if it works, go for it!

To me it seems more convoluted, but then again I know very little PHP.

Good Luck!
Copy linkTweet thisAlerts:
@vwphillipsFeb 18.2008 — [CODE]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">


<head>

<title>
</title>
<script language="JavaScript" type="text/javascript">
/*<![CDATA[*/

function Test(nme){
var cboxes=document.getElementsByName(nme);
cnt=0;
for (var zxc0=0;zxc0<cboxes.length;zxc0++){
if (cboxes[zxc0].checked) cnt++;
}
alert(cnt+' boxes checked');
}

/*]]>*/
</script>
</head>


<body>

<form id="myform" name="myform">
<div id="mydiv" name="mydiv"> check 1
<input type="checkbox" name="mybox[]" id="mybox[]" value="2" > check 2
<input type="checkbox" name="mybox[]" id="mybox[]" value="4" > check 3
<input type="checkbox" name="mybox[]" id="mybox[]" value="6" >
</div>
<input type="button" name="" value="TEST" onclick="Test('mybox[]');"/>
</form>

</body>


</html>[/CODE]
Copy linkTweet thisAlerts:
@NotionCommotionauthorFeb 18.2008 — Thank you Vic, that was exactly what I was looking for.

Just curious, but should I remove the ' id="mybox[]" ' from the html?

Thanks!
Copy linkTweet thisAlerts:
@vwphillipsFeb 18.2008 — duplication of an id name is illegal and it serves no purpose, so yes.
×

Success!

Help @NotionCommotion spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.12,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...