必ず一つチェックされているチェックボックスの生成の仕方

0   名前： 初心者です。 ： 2006/12/28（木） 21:45  ID:NvGleDjg
はじめまして。
今回、投稿させていただいたのは
現在行っているJavaScriptで方法がわからなく、
行き詰まってしまったからです。
どうか、お分かりになる方がいらっしゃいましたら
教えてください。

チェックボックスがあるとして
必ず一つチェックをしたいのです。
でも必ずどれかにチェックがあって
消えないようにしたいと
思っています。

この方法がどうしてもなくて
困ってしまっています。

どうぞ宜しくお願いします。
1   名前： 牛若 ： 2006/12/28（木） 21:45  ID:uWJPeZ36
どうしてもチェックボックスでなければならない理由があれば別ですが、
そのような場合にはラジオボタンが便利です。
2   名前： 初心者です。 ： 2006/12/28（木） 21:45  ID:NvGleDjg
はい、どうしてもチェックボックスを使用したいのです。
ラジオボタンが適していることは重々承知なのですが。。
3   名前： naokun ： 2006/12/28（木） 21:45  ID:HsrxHP7o
>2
少なくとも１項目以上選択させたいという事でしょうか？

手順として、

　　[1]チェックボックス生成時にname属性にグループ名を付け、
　　　デフォルトでどれかにチェックを付けておく

　　[2]onclick イベント時にフラグ用変数を用意し、グループ内をループさせ
　　　チェックされているチェックボックスがあればフラグを立てる

　　[3]ループ後、フラグが立ってなければ、
　　　現在のチェックボックスを ON にする

ってのはいかがでしょう？

突っ込みなどありましたら、皆様よろしくお願いします。
4   名前： 匿名 ： 2006/12/28（木） 21:45  ID:NvGleDjg
三つチェックボックスがあったら、
必ずどれか一つにチェックあります。
三つすべてチェックが入っていないことはないようにします。
二つはチェックできません。


<html>
<head>
</head>
<meta http-equiv="content-type" content="text/html;charset=Shift_JIS">
<link rel="stylesheet" type="text/css" href="./css/default.css">
<SCRIPT language="JavaScript">
<!--
function Check(form,Cn){
form = chB.elements
for(i=0;i<2;i++){
if(i!=Cn && form["check"+i].checked) form["check"+i].checked = false
}
}
-->
</script>
<table border="1">
<form name="chB">
<tr><td rowspan ="2">あ</td><td>い</td><td id="minus" align="right">う</td><td id="mark">○</td><td><input type="checkbox" checked name="check0" onClick="Check(this.form,0)"></td></tr>
<tr><td>え</td><td align="right">お</td><td>△</td><td><input type="checkbox" name="check1" onClick="Check(this.form,1)"></td></tr>
</form>
</table>
</html>

このようなJavaScriptを使用して
必ず一つはチェックできるのですが二回押せばチェックは消えてしまいます。
これをどうにかしたいと考えています。
5   名前： 匿名 ： 2006/12/28（木） 21:45  ID:fqUPSjiv
ラジオボタンを使わない理由を示すべし。

業務上 HTML を修正できない事情があるにしても、動的にラジオボタンに変更すれば良いだけの話に見える。
6   名前： 初心者です。 ： 2006/12/28（木） 21:45  ID:NvGleDjg
そうですか。
難しいということなんでしょうか。
理由としては、このチェックを行うところは
「チェックつける」という意味があります。
また、このチェックをつけることを行う方は
ほとんど操作に慣れてない方で、そのような方に
イメージとしてわかりやすいほうがいいということ
のようです。
ラジオボタンよりもチェックボックスのほうが
チェックをつけるようなイメージではありませんか？
もしだめなようでしたらそのように報告したいと
思います。

お手数をおかけしました。
7   名前： naokun ： 2006/12/28（木） 21:45  ID:HsrxHP7o
function Check(form,Cn)の中身だけ以下のようにしてみて下さい。
当方 WinXP , IE6 ではうまくいきましたよ。

function Check(form,Cn){
   var i ;
   var bFlg ;
   bFlg = true ;
   form = chB.elements
   for(i=0;i<2;i++){
      if(i!=Cn && form["check"+i].checked){
         form["check"+i].checked = false
         bFlg = false ;
      }
   }
   if ( bFlg ) {
      form["check"+Cn].checked = true
   }
}

8   名前： 初心者です。 ： 2006/12/28（木） 21:45  ID:NvGleDjg
この通り行ってみましたら
うまくいきました！
チェックボックスの機能ではできないのかなと
あきらめていました。
良かったです！

Flagを区別させて条件文を作成すると
できるのですね。
すばらしいですね。

naokunさん、ありがとうございます！
そして、コメントくださったみなさんありがとうございます！
役立てさせていただきますね！！

9   名前： naokun ： 2006/12/28（木） 21:45  ID:HsrxHP7o
>7
あ。セミコロン忘れてる…
入れといてください…
10   名前： 初心者です。 ： 2006/12/28（木） 21:45  ID:NvGleDjg
つけておきました！
11   名前： 匿名 ： 2006/12/28（木） 21:45  ID:fqUPSjiv
>>6
> ラジオボタンよりもチェックボックスのほうが
> チェックをつけるようなイメージではありませんか？

それは大いなる勘違い。ラジオボタンは単一選択、チェックボックスは複数選択というのが一般的な意識だから、かえってユーザビリティ上の問題が生じる。そもそもボタンがどうレンダリングされるかなんてブラウザ次第だし、サイト設計上も余計な手間が掛かる（JavaScript 無効の場合、サーバ側でチェックする手間も増やさねばならない）。


>>7
フラグはいらないと思う。click 時にグループ内のチェックを全部外してから、現ノードにチェックを入れるだけで済む。数が多いなら、前回チェックされたノードを保持しておけば良い。
12   名前： naokun ： 2006/12/28（木） 21:45  ID:HsrxHP7o
>11 匿名様

>フラグはいらないと思う。click 時にグループ内のチェックを全部外してから、現ノ>ードにチェックを入れるだけで済む。数が多いなら、前回チェックされたノードを保>持しておけば良い。

あ、そうですね、
「初心者です。」さん、次のでお願いします。


function Check(form,Cn){
   var i ;
   form = chB.elements ;
   for(i=0;i<2;i++){
      form["check"+i].checked = false
   }
   form["check"+Cn].checked = true
}
一覧へ戻る