ラジオボタンの全選択
ラジオボタンで全選択をしたくて、探したらチェックボックスで全選択はあるんだけど、ラジオボックスは見つからなかった。(ググり方が悪い?)
なので、チェックボックスのものを参考に作ってみました。
<html> <head> <script type="text/javascript"> <!-- function allcheck(targetForm,flag){ for(n=0;n<=targetForm.length-1;n++){ if(targetForm.elements[n].type == "radio" && targetForm.elements[n].value == flag){ targetForm.elements[n].checked = true; } } } --> </script> </head> <body> <form> <input type="button" value="全選択" onClick="allcheck(this.form,1)"> <input type="button" value="全選択" onClick="allcheck(this.form,0)"><br /> <label id="sample1"><input type="radio" name="sample21" value="1" id="sample1">可</label> <label id="sample1"><input type="radio" name="sample21" value="0" id="sample1">不可</label><br /> <label id="sample2"><input type="radio" name="sample2" value="1" id="sample2">可</label> <label id="sample2"><input type="radio" name="sample2" value="0" id="sample2">不可</label><br /> <label id="sample3"><input type="radio" name="sample3" value="1" id="sample3">可</label> <label id="sample3"><input type="radio" name="sample3" value="0" id="sample3">不可</label><br /> </form> </body> </html>
んで、今回はリンクで全選択できるようにしたかったのでさらに修正して
<html> <head> <script type="text/javascript"> <!-- function allcheck(targetForm,flag){ for(n=0;n<=targetForm.length-1;n++){ if(targetForm.elements[n].type == "radio" && targetForm.elements[n].value == flag){ targetForm.elements[n].checked = true; } } return false; } --> </script> </head> <body> <form name="set"> <a href="#" onclick="allcheck(set,1)">一括選択</a> <a href="#" onclick="allcheck(set,0)">一括選択</a><br /> <label id="sample1"><input type="radio" name="sample21" value="1" id="sample1">可</label> <label id="sample1"><input type="radio" name="sample21" value="0" id="sample1">不可</label><br /> <label id="sample2"><input type="radio" name="sample2" value="1" id="sample2">可</label> <label id="sample2"><input type="radio" name="sample2" value="0" id="sample2">不可</label><br /> <label id="sample3"><input type="radio" name="sample3" value="1" id="sample3">可</label> <label id="sample3"><input type="radio" name="sample3" value="0" id="sample3">不可</label><br /> </form> </body> </html>
のようになりました。
また、
<a href="#" onclick="allcheck(set,1)">一括選択</a> <a href="#" onclick="allcheck(set,0)">一括選択</a><br />
を
<a href="" onclick="allcheck(set,1);return false">一括選択</a> <a href="" onclick="allcheck(set,0);return false">一括選択</a><br />
のようにしたら javascript に return false をつけなくてもいいよ。
# を付けなくてもいいしこっちのほうがいいのかな?
retun false はリンク先に飛ばないようにつけるんだってさ!!