JavaScriptにて、2つのチェックボックスのチェックができません

質問

お世話になっております。
お分かりになる方いらっしゃいましたら、ご教授願えますでしょうか？

現在採用に関する応募フォームを作成しています。

JavaScriptにてフォーム内のチェックボックスに
チェックが入っているか、必須チェックをさせたいと思っています。

テキストボックスやコンボボックスなど、いくつか必須チェックがある中で、
チェックボックスの項目についての必須チェックがうまくいきません。
チェック完了後、cgiにてメールを送信するようにしているのですが、
チェックがされず、メールを送信してしまいます。

ローカルで行ってみたのですが、チェックをスルーして、
cgiに遷移してしまいます。

フォームイメージは以下の感じです。

<応募フォーム>
---------------------------
希望勤務地：□本社　□大阪
---------------------------

2つのチェックボックスどちらにもチェックが入っていない場合は、
エラーメッセージを出し、処理を中止します。
どちらのチェックボックスにもチェックが入っていても、
エラーは出さずにcgiへ遷移します。

以下は現在のコードの内容です。

<HTMLコード>
<form method="POST" action="send.cgi" name="応募フォーム" onSubmit="return check()">
<input type="checkbox" name="希望勤務地" value="本社" checked>本社
<input type="checkbox" name="希望勤務地" value="大阪">大阪
<input type="submit" value=" 送信 ">
<input type="reset" value=" 取消 ">

<Scriptコード>
function check(){
if(!document.応募フォーム.希望勤務地.value.checked){
flag = 1;
window.alert('必須項目[希望勤務地]にチェックがされていません');
}
}

色々試してみたのですが、うまくいきませんでした。
チェックボックスのnameを同じ名前にしているのが原因でしょうか？

お手数ですが、宜しくお願いいたします。

回答No.2

yambejp · ベストアンサー

同名のオブジェクトをつかうならこんな風にします。

<script>
function check(obj){
var flag = true;
if(!obj.elements["希望勤務地"][0].checked && !obj.elements["希望勤務地"][1].checked){
alert('必須項目[希望勤務地]にチェックがされていません');
flag= false;
}
return flag;
}
</script>
<form method="POST" action="send.cgi" name="応募フォーム" onSubmit="return check(this)">
<input type="checkbox" name="希望勤務地" value="本社" checked>本社
<input type="checkbox" name="希望勤務地" value="大阪">大阪
<input type="submit" value=" 送信 ">
<input type="reset" value=" 取消 ">
</form>

お礼

ご回答ありがとうございます！

ご教授頂きましたコードを組み込んでみたところ、
無事チェックがされました！

同名の場合はこのように処理を書き込むんですね。

ご協力感謝致します！
ありがとうございました！

回答No.1

nda23

function check()
単にalertしているだけです。Submitのイベントをキャンセルしないと
その先に進んでしまいます。
キャンセルするには以下のようにイベントオブジェクトを設定します。
window.event.returnValue = false;
http://www.tohoho-web.com/js/event.htm

お礼

ご回答ありがとうございます！

大変申し訳ありません・・・。
フラグの真偽をチェックするコードを書き忘れてしまいました(汗
実は<Scriptコード>の部分の後に以下のような処理をしています。

//設定終了
if(flag){
return false; // 送信を中止
}
else{
return true; // 送信を実行
}
window.alert('設定完了')
}

別の名前のチェックボックスの場合はうまくいくのですが、
チェックボックスの名前を同名にするとうまくいかないようです。

yambejpさんが回答された内容を採用させていただきます。
nda23さんもご協力ありがとうございました！