チェックボックスの未入力チェック

質問

ざっとですけれども
<form action="**" name="myform" onsubmit="return Check()" method=post>
<input type="checkbox" name="Erasedata" id="Erasedata" value="1" >
<input type="checkbox" name="Erasedata" id="Erasedata" value="2" >
・・・
<input type="checkbox" name="Erasedata" id="Erasedata" value="5" >
<input type="submit" value="選択されたものを削除する">
このようなチェックボックスがあったとして
function Check()
{
for (i=0;i<document.myform.length;i++)
　{
　　if(document.myform.Erasedata[i].checked==true)
{return true;}
　}
alert("どこかにチェックを入れて下さい ");
return false;
}
といった感じで未入力チェックをしています。
チェックボックスが複数の場合はうまく動くのですが、チェックボックスがひとつだとうまくいきません。スクリプトで何か問題があるようでしたらご指摘お願いできませんでしょうか。よろしくお願いいたします。

回答No.3

yambejp · ベストアンサー

そうですね。あんまりうるさくいうと嫌がられるのであえて指摘しません
でしたが、向学のためせっかくなのでいくつかご指摘を。

・id="Erasedata"が複数見受けられます。idはユニークでないと意味が
ありません。
・formに名前をつけて管理するやり方は古いので現在非推奨です。
・今回の命題が「Erasedataのどれか1つだけにチェックをつけさせる」
のであればcheckboxではなくradioでやってください
・複数選択が可能であればcheckboxにErasedataという同じ名前をつけて
やるのはあまり良い方法ではありません。
せめて「Erasedata[]」のようにサーバー側で配列として認識できるように
した方がよいでしょう。
・回答でもやりましたが、フラグを使って処理をしたほうが汎用性があがります。
チェックボックス以外のチェックもあるでしょうから・・・。
・document.myformをforでまわすのに、孫要素（子要素の子要素）
document.myform.Erasedata[i]のcheckedをチェックするのは無理があります。
ループで回してチェックできるのは子要素までと考えてください。
・回答にもあるとおり、Checkで受け渡すときに自分自身「this」を
渡してやると、汎用性があがります。

・細かい話だと、コーテーションの付け方に一貫性がないとか、checkbox
の要素に表示するテキストがないとか、inputタグを閉じるときはスラッシュを
入れたほうがよいとか、まぁいろいろ・・・

お礼

貴重なご指摘ありがとうございます。
とても参考になりました。
基本的なところをもうちょっと勉強してみます。
また機会がありましたらよろしくお願いいたします。

回答No.2

yambejp

つっこみどころが多いソースですが、とりあえず１つでも動くようにするには
以下のようにしてみてください。

<script>
function Check(f){
var flg=false;
for (i=0;i<f.length;i++){
if(f[i].type=="checkbox" &&f[i].checked==true) flg=true;
}
if(!flg) alert("どこかにチェックを入れて下さい ");
return flg;
}
</script>

1:<br>
<form onsubmit="return Check(this)">
<input type="checkbox" name="E1" id="Erasedata" value="1" >
<input type="checkbox" name="E1" id="Erasedata" value="2" >
<input type="submit" value="go!">
</form>
2:<br>
<form onsubmit="return Check(this)">
<input type="checkbox" name="E2" id="Erasedata" value="1" >
<input type="submit" value="go!">
</form>

補足

ありがとうございます。
ばっちり動いたんですが、その他にも突っ込みどころがございましたら、どんどん突っ込んでいただけませんでしょうか?
何卒宜しくお願いいたします。

回答No.1

redfox63

チェックしたいのがチェックボックスだけなら for文の終了条件を
i<document.myform.Erasedata.length
にして見ましょう
document.myform.lengthですと formの子要素の数になります
チェックが入っていない場合 Submitボタンなどまでカウンタが進んでしまい チェックボックスの添え字の範囲を超えてしまいます

補足

回答ありがとうございます。
for (i=0;i<document.myform.Erasedata.length;i++)
にしてみたのですが、checkboxが一つだとalertが出てしまいます。
何か他に問題があるのでしょうか?