javascriptでラジオボタンの値を取得する
フォームを作っていて、CGIに値を渡す前にJava Scriptでいろいろとチェックして、あり得ない組み合わせになっていたらアラートを出して進めなくしたいシチュエーションってありますよね。
例えば、名前を入力していなかったら、画面が変わる前にアラートを出す場合、
if(document.getElementById("name").value=='')
{
alert('名前が入力されていません');
}
上の場合、idがnameになっているもののvalueの値を参照するわけです。
で、ラジオボタンのname属性が同じものから、選択されているvalue値を読み込んで、あり得ない組み合わせになっていないかどうか調べる場合、mdはてっきり
if(document.getElementsByName("payment")=='クレジットカード払い' &&...){....}
だと思ってたんですが、Firebug様がエラー連発。調べること数時間....ラジオボタンって、配列なことが判明orz
ラジオボタンのname属性が同じものから、選択されているvalue値を取り込む
こんな関数を作って
function radioValue(element)
{
var len;
len = element.length;
for (i=0;i<len;i++) {
if (element[i].checked) return element[i].value;
}
return "";
}
こんな感じに使います。
function formcheck(){
if (radioValue(document.form01.user)=='初めて利用する' && radioValue(document.form01.payment)=='後払い銀行振込')
{
alert('初めてご利用の方は、支払い方法に「後払い銀行振込」を選択できません。他の支払い方法を選択してください。');
return false;
}
else
{
return true;
}
}
formのname属性がform01で、ラジオボタンのname属性がuserのものとpaymentのものから、特定の組み合わせをはじく。下の場合、「初めて利用する人」の支払い方法が「後払い銀行振込」の場合、アラートが出て先へ進めなくするパターン。
で、エラーがなければ、CGIにsubmitするようにするには
<input name="submitButtonName" type="button" value="送信内容を確認する" onclick="if(formcheck()==true){document.form01.submit();}" />
って、これだけじゃわかりにくいですね(^^;)。
あとでちゃんと書きます(本日ダウン)