2009/01/29

[javascript]radioボタンの必須チェック(n個分)

昨日、t.sato君からコメントを頂いたので、改めて考え直してみる。
radioボタンがn個あった場合の必須チェックで、今回は、3つの場合を考えてみたいと思います。

<form name="frm">
<input type="radio" name="hoge" value="1">test_01
<input type="radio" name="hoge" value="3">test_02
<input type="radio" name="hoge" value="2">test_03
<input type="button" value="run"
onclick="lf_checkRadio(frm.hoge);"
>
</form>
<script type="text/javascript">
function lf_checkRadio(aRadioObj){
var ret;

ret = (function(){

with(document){
var input_length = aRadioObj.length;

/* radioボタンが一個の場合 */
if(input_length == undefined){

/* チェックがついている場合 */
if(aRadioObj.checked){
return true;

/* チェックがついていない場合 */
}else{
return false;
}
/* radioボタンが複数ある場合 */
}else{

/* radioボタンの数だけループ */
for(var i=0; i<input_length; i++){

/* 一回でもついている場合は、その場でtrueを返す */
if(aRadioObj[i].checked){
return true;
}
}

/* チェックがついていない場合 */
return false;
}
}
}());

/* チェックがついていない場合 */
if(!ret){
alert("チェックが入っていません");
/* 以下、チェックがついていない場合の処理を追加 */
/* ・・・・ */
return false;
/* チェックがついている場合 */
}else{
alert("チェックが入っています。");
/* 以下、チェックがついている場合の処理を追加 */
/* ・・・・ */
return true;
}
}
</script>

で、いけるはず!!(IE6にて動作確認)

工夫した点は、、t.sato君がいってたように、lengthで個数を取得し、ループでチェックしたところ。

そして、そのお仕事を無名関数を使って実装した点。
あと最後に、引数に「formの名前.inputタグの名前」を入れればどんな状況でも必須チェックが可能になるようにしたこと。

無名関数の部分は、ちょっと前だったら、名前のついた別ファンクションを定義しなければ実装できなかったのですが、schemeでlambdaに出会ってから、ふっつーに思いつくようになりました。

ここでも、schemeも大切さを改めて実感。

1 件のコメント:

  1. お、できたかー。良かった良かった嘘は言ってなかったようだ。

    後は一個の場合、複数の場合って分岐するのがダルかったら、引数にオブジェクトを受け取るんじゃなくて、引数はStringで受け取って、getElementSByNameでオブジェクトの配列を取得! ってやれば多分1個の時でもlengthが1で返ってきて綺麗になるかも。

    といってもわざとオブジェクトを渡してるみたいだしこれはいいか・・・。

    返信削除