チェックボックスのチェックについて

質問

submit時に一つでもチェックがなければアラートを表示
チェックがあれば進む・・・としたいです。

<form action=next.html name=form1>
<input type=checkbox name=checkbox1 value=1>
<input type=checkbox name=checkbox2 value=2>
<input type=checkbox name=checkbox3 value=3>
<input type=checkbox name=checkbox4 value=4>
<input type=checkbox name=checkbox5 value=5>
～以下50まで続きます
<input type=submit value=submit>
</form>

function countChecked(form1) {
var total = 0;
var max = 50;
for (var index = 0; index < form1.checkbox.length; index++) {
total += form1.checkbox[index].checked ? 1 : 0;
}
if(countChecked(document.form1)) > 0) {
return true;
} else {
alert("no");
return false;
}
return(total);
}

過去に似たような質問を参考に作ってみましたがダメでした。
チェックボックスの名前の付け方が悪いのでしょうか。

回答No.1

yambejp · ベストアンサー

やるならformないのでエレメントをすべてチェックする方法が
もっとも手っ取り早いですね。

ちなみにご質問のソースではreturnでtotalとか返そうとしてますが
フロー的にそこが走るように作られていませんね。
以下のようにしてみてください

<script language=javascript>
function countChecked(f){
var total = 0;
for (var i=0; i< f.length; i++) {
if(f[i].type=="checkbox" && f[i].checked) total++
}
if(total == 0){
alert("no");
return false;
}
alert(total);
return true;
}
</script>

<form action=next.html name=form1 onSubmit="return countChecked(this)">
<input type=checkbox name=checkbox1 value=1>
<input type=checkbox name=checkbox2 value=2>
<input type=checkbox name=checkbox3 value=3>
<input type=checkbox name=checkbox4 value=4>
<input type=checkbox name=checkbox5 value=5>
～以下50まで続きます
<input type=submit value=submit>
</form>

お礼

ありがとうございました、無事できました。
大変勉強になりました。

回答No.2

crepon133

<script type="text/javascript">
<!--
function Check()
{
count = 0;
for (i=0; i<=49; i++)
if (document.form1.elements[i].checked) count++;
if (count==0) {
alert("no");
document.form1.elements[0].focus();
return false;
}
}
//-->
</script>

<form action="next.html" name="form1" onsubmit="return Check();">
<input type="checkbox" name="checkbox" value="1">
<input type="checkbox" name="checkbox" value="2">
<input type="checkbox" name="checkbox" value="3">
<input type="checkbox" name="checkbox" value="4">
<input type="checkbox" name="checkbox" value="5">
～以下50まで続きます
<input type="submit" name="submit" value="送信">
</form>

お礼

ありがとうございました、こういった方法もあるのですね。
参考にさせていただきます。