• ベストアンサー

指定したチェックボックスを一斉に選択する方法

こんにちは http://oshiete1.goo.ne.jp/kotaeru.php3?q=384409 で質問されていた内容と全く同じですが、恥ずかしながらも回答が私には理解できなかったので、易しく教えて下さいませんでしょうか? フォームのチェックボックスに駅名を入れていますが、何百件もの数になるので、自動にチェックをいれたいのです。 <INPUT TYPE="CHECKBOX" NAME="eki" VALUE="新今宮">新今宮 <INPUT TYPE="CHECKBOX" NAME="eki" VALUE="天王寺">天王寺 <INPUT TYPE="CHECKBOX" NAME="eki" VALUE="心斎橋">心斎橋 <INPUT TYPE="CHECKBOX" NAME="eki" VALUE="難波">難波 こんな感じで何百件も記述しています。 環状線全チェックをクリックしたら、環状線のみ一括選択 御堂筋線全チェックをクリックしたら御堂筋線のみ一括選択 という風にしたいです。 うまく伝わりましたでしょうか? 宜しくお願いします。

質問者が選んだベストアンサー

  • ベストアンサー
  • yambejp
  • ベストアンサー率51% (3827/7415)
回答No.2

以前の回答にけちをつけるわけではないですが 複数のタグに同じnameを振るのはいささか 使い勝手がわるいようなきがします。 共通の属性を持たせたい場合はclassが便利です。 <script language="javascript"> function classCheck(f,cn,flag){ for (var i=0;i<f.elements.length;i++){ if(f.elements[i].className==cn){f.elements[i].checked=flag} } } </script> <form> <input type="checkbox" name="retasu" value="1" class="yasai">レタス<br> <input type="checkbox" name="kyuri" value="1" class="yasai">きゅうり<br> <input type="checkbox" name="ninjin" value="1" class="yasai">にんじん<br> <input type="checkbox" name="ringo" value="1" class="fruit">りんご<br> <input type="checkbox" name="mikan" value="1" class="fruit">みかん<br> <input type="checkbox" name="budou" value="1" class="fruit">ぶどう<br> <input type="button" value="野菜チェック" onClick="classCheck(this.form,'yasai',true)"> <input type="button" value="果物チェック" onClick="classCheck(this.form,'fruit',true)"> <input type="button" value="野菜チェックはずす" onClick="classCheck(this.form,'yasai',false)"> <input type="button" value="果物チェックはずす" onClick="classCheck(this.form,'fruit',false)"> <form> </body> </html>

sanmanohiraki
質問者

お礼

有難うございます! おかげで、思ってたとおりの結果になりました! しかも、初心者の私にも大変分かりやすい説明で、無事できました!

その他の回答 (1)

  • BLUEPIXY
  • ベストアンサー率50% (3003/5914)
回答No.1

参照URLは、同一の名前のチェックボックスにチェックを付ける(getElementsByNameで同一の名前のフォームのコレクション(リスト)を得てそれをチェックを付ける処理をしている)処理をしています。 なので、例えば、 環状線全チェックのチェックボックスと同じ名前のチェックボックスを環状線のそれぞれの駅のフォームの名前につけてやれば、良いです。

sanmanohiraki
質問者

お礼

早速の回答有難うございました! なるほど、そういう処理をしていたのですね。。。 参考になりました!

関連するQ&A

  • 指定したチェックボックスに一斉にチェック

    下記の「関東」をクリックすると、東京、神奈川にチェックを入れたいのですが・・。実際のチェックボックスはたくさんあります。 function test() {ここにどうかく?} <a href="javaScript:test()">関東</a><BR> <INPUT TYPE="CHECKBOX" NAME="basho" VALUE="東京">東京  <INPUT TYPE="CHECKBOX" NAME="basho" VALUE="神奈川">神奈川  <INPUT TYPE="CHECKBOX" NAME="basho" VALUE="鹿児島">鹿児島  <INPUT TYPE="CHECKBOX" NAME="basho" VALUE="大分">大分

  • チェックボックスの全選択

    <input type="checkbox" name="chk" value=1> <input type="checkbox" name="chk" value=2> <input type="checkbox" name="chk" value=3> <input type="checkbox" name="chk" value=4> <input type="checkbox" name="chk" value=5> このように同一名称のチェックボックスに対して ボタンを押下された時全てのチェックボックスを チェックするJavaScriptの 書き方を教えて貰えないでしょうか

  • チェックボックス選択で(3つ)まで

    チェックボックス選択で(3つ)まで <input type="checkbox" name="fhobby" value="animation">アニメ <input type="checkbox" name="fhobby" value="game">ゲーム <input type="checkbox" name="fhobby" value="reading">読書 <input type="checkbox" name="fhobby" value="amusement">娯楽 <input type="checkbox" name="fhobby" value="comics">漫画 <input type="checkbox" name="fhobby" value="jogging">ジョギング<br> <input type="checkbox" name="fhobby" value="cycling">サイクリング <input type="checkbox" name="fhobby" value="shopping">ショッピング <input type="checkbox" name="fhobby" value="picture">絵画 <input type="checkbox" name="fhobby" value="travel">旅行 <input type="checkbox" name="fhobby" value="others">その他

    • ベストアンサー
    • HTML
  • javascriptでチェックボックスの選択状況をチェックする方法につ

    javascriptでチェックボックスの選択状況をチェックする方法について質問です。 チェックボックスを <input type="checkbox" name="chk[]" value="1"> <input type="checkbox" name="chk[]" value="2"> のようにした場合、チェックボックスが1か所以上選択されているかどうかは、 var count = 0; for (var i=0;i<document.myform.elements['chk[]'].length;i++){ if(document.myform.elements['chk[]'][i].checked){ count++; } } if(count==0){ window.alert("チェックしてください!"); } のようにすればチェック可能ですが、inputタグで <input type="checkbox" name="chk1[]" value="1"> <input type="checkbox" name="chk1[]" value="2"> <input type="checkbox" name="chk2[]" value="A"> <input type="checkbox" name="chk2[]" value="B"> のように「name」の配列名が変化する場合はどのようにすればチェック可能でしょうか?

  • CGIでチェックボックスを使う方法

    チェックボックスをCGI(C言語)で使用する方法を教えて下さい。 例えば、HTMLで <input type="checkbox" name="Check1" value="Sel11" /> チェック1 選択1<br /> <input type="checkbox" name="Check1" value="Sel12" /> チェック1 選択2<br /> <input type="checkbox" name="Check1" value="Sel13" /> チェック1 選択3 <hr /> <input type="checkbox" name="Check2" value="Sel21" checked /> チェック2 選択1<br /> <input type="checkbox" name="Check2" value="Sel22" /> チェック2 選択2<br /> <input type="checkbox" name="Check2" value="Sel23" checked /> チェック2 選択3 というプログラムはCGI(C言語)ではどの様に記述すれば良いでしょうか?

    • ベストアンサー
    • CGI
  • チェックボックスの戻り

    チェックボックスのvalue値に数字を入れてPOSTしています。 DB登録の前にその値を足し算してDBに登録しています。 <input type="checkbox" name="cb[0]" value="1"> <input type="checkbox" name="cb[1]" value="2"> <input type="checkbox" name="cb[2]" value="4"> <input type="checkbox" name="cb[3]" value="8"> <input type="checkbox" name="cb[4]" value="16"> ・・・のようにしています。DBの値を読み取ってcheckedを付ける際はどのようにしたら効率よく処理できるでしょうか?switchを使うとすごくチェックボックスの数が増えると厄介です。困っています。教えてください。

    • ベストアンサー
    • PHP
  • チェックに応じて違うチェックボックスをアクティブにしたい

    次のHTMLのように、大分類、小分類のような構成のチェックボックス グループがあります(初期設定は全部チェック無しです) 普段は[a][b][c][d]をdisableとしておき、(1) にチェックが入った 場合に[d]以外([a][b][c])アクティブ(?とにかくチェックを入れる ことができる)ようにするにはどうしたらいいでしょうか。 よろしくお願い致します。 <form id="Form1"> : <INPUT TYPE="CHECKBOX" NAME="food" value="果物">(1) 果物 <INPUT TYPE="CHECKBOX" NAME="food" value="野菜">(2) 野菜 <INPUT TYPE="CHECKBOX" NAME="food" value="肉魚">(3) 肉魚 <br> <INPUT TYPE="CHECKBOX" NAME="fruit" value="りんご">[a] りんご <INPUT TYPE="CHECKBOX" NAME="fruit" value="みかん">[b] みかん <INPUT TYPE="CHECKBOX" NAME="fruit" value="ぶどう">[c] ぶどう <INPUT TYPE="CHECKBOX" NAME="fruit" value="バナナ">[d] バナナ : </form>

  • グループ別けされたチェックボックスの選択および解除

    こんばんは。いつもお世話になっております。 随分前になりますが、こちらでご指導いただいた内容を元に、タイトルにある、グループ別けされたチェックボックス郡の選択および解除をしたいと考えているのですが、お恥ずかしながら、思うような結果を得る事が出来ません。 お忙しい中恐縮ですが、ご指導いただきたく投函させて頂きます。 ※グループ単位で選択or解除をしたい □カテゴリ(すべて選択or解除) □1 □2 □3 □4 □5 □タイプ □1 □2 □3 □4 □5 文字数制限に引っかかってしまったので、javascpipt部は非表示にいたします。 <input type="checkbox" onclick="CheckAlt(this)"> <div id="category"> <input type="checkbox" name="category[]" value="1"> <input type="checkbox" name="category[]" value="2"> <input type="checkbox" name="category[]" value="3"> <input type="checkbox" name="category[]" value="4"> <input type="checkbox" name="category[]" value="5"> </div> <input type="checkbox" onclick="CheckAlt(this)"> <div id="type"> <input type="checkbox" name="type[]" value="1"> <input type="checkbox" name="type[]" value="2"> <input type="checkbox" name="type[]" value="3"> <input type="checkbox" name="type[]" value="4"> <input type="checkbox" name="type[]" value="5"> </div>

  • 複数のチェックボックスをチェックしたい

    質問させてください。 複数のチェックボックスを項目別に全てチェックするようなjqueryの書き方をご教授いただきたいです。 <table> <tr> <td> <input type="checkbox" name="" />まとめてチェック </td> </tr> <tr> <td> <li><input type="checkbox" name="" value="" />a</li> <li><input type="checkbox" name="" value="" />b</li> <li><input type="checkbox" name="" value="" />c</li> <li><input type="checkbox" name="" value="" />d</li> </td> </tr> <tr> <td> <input type="checkbox" name="" />まとめてチェック </td> </tr> <tr> <td> <li><input type="checkbox" name="" value="" />e</li> <li><input type="checkbox" name="" value="" />f</li> <li><input type="checkbox" name="" value="" />g</li> <li><input type="checkbox" name="" value="" />h</li> </td> </tr> <tr> <td> <input type="checkbox" name="" />まとめてチェック </td> </tr> <tr> <td> <li><input type="checkbox" name="" value="" />i</li> <li><input type="checkbox" name="" value="" />j</li> <li><input type="checkbox" name="" value="" />k</li> <li><input type="checkbox" name="" value="" />l</li> </td> </tr> </table> 上記のようにそれぞれの項目に「まとめてチェック」のチェックボックスがあり、 そこに該当するチェック項目は全てチェックorチェックを外す っという挙動の実装を考えています。 jqueryでやりたいのですが、javascript、jqueryがかなり苦手でいまいちいきません。 ググって $(function(){ $('#all').click(function(){ if(this.checked){ $('#check input').attr('checked','checked'); }else{ $('#check input').removeAttr('checked'); } }); }); このソースを見つけたのですが、これだと一つの項目でしか実装できず 項目分このjqueryを書くのも余り良い書き方だと思えません。 どなたか、ご教授お願いいたします。

  • チェックボックスのチェックについて

    submit時に一つでもチェックがなければアラートを表示 チェックがあれば進む・・・としたいです。 <form action=next.html name=form1> <input type=checkbox name=checkbox1 value=1> <input type=checkbox name=checkbox2 value=2> <input type=checkbox name=checkbox3 value=3> <input type=checkbox name=checkbox4 value=4> <input type=checkbox name=checkbox5 value=5> ~以下50まで続きます <input type=submit value=submit> </form> function countChecked(form1) { var total = 0; var max = 50; for (var index = 0; index < form1.checkbox.length; index++) { total += form1.checkbox[index].checked ? 1 : 0; } if(countChecked(document.form1)) > 0) { return true; } else { alert("no"); return false; } return(total); } 過去に似たような質問を参考に作ってみましたがダメでした。 チェックボックスの名前の付け方が悪いのでしょうか。

専門家に質問してみよう