<input type='checkbox'>要素でcheckboxの数をチェックしたい
- 基本的なCSS及びPHPの知識が乏しい為、自己で解決出来ずに困っています。
- 表示した内容から、checkboxで10個のデータ選択させたいと考えています。
- 選択した数が10個でなければ、javascriptでクライアント端末側にアラートをポップアップ表示させたい考えています。
- ベストアンサー
<input type='checkbox'>要素でcheckboxの数をチェックしたい
基本的なCSS及びPHPの知識が乏しい為、自己で解決出来ずに困っています。 ある任意のデータファイルをオープンして、Webページに表示させます。 -------------------------------------------------------------------------- <html> <body> <form action='test2.php' method='post'> <?php $logfile = './logdata.txt'; $fp = fopen($logfile, "r"); while($str = fgetcsv($fp)){ $data1[] = $str[0]; $data2[] = $str[1]; } fclose($fp); for ($i = 0; $i < sizeof($data1); $i++){ print "<input type='checkbox' name='col1[]' value='$data1[$i]'>"; print "<input type='text' name='col2[]' value='$data2[$i]' >"; print "<br>"; } ?> <input type='submit' value='実行'> </form> </body> </html> -------------------------------------------------------------------------- 表示した内容から、checkboxで10個のデータ選択させたいと考えています。 選択したデータを次ページの'test2.php' に配列(col1[]、col2[])にして 送信しているのですが、このスクリプト内で、checkboxで選択する数のチェックを行い、 選択した数が10個でなければ、javascriptでクライアント端末側にアラートを ポップアップ表示させたい考えています。 ------------------------------------------- <script type='text/javascript'> function checkbox_alert() { alert("選択数は10個にして下さい"); } </script> ------------------------------------------- 上記のようなfunctionをスクリプにを挿入すれば出来ると考えているのですが、 具体的な記載方法が分かりません。 どなたかお分かりになる方がいらっしゃいましたら、教えて頂けないでしょうか。
- khaii21
- お礼率47% (19/40)
- PHP
- 回答数2
- ありがとう数1
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
このような感じで如何でしょう ------------------------------- <html><head> <SCRIPT language="JavaScript"> <!-- function CBCheck() { var count = 0; for (var i=0;i<document.myForm.elements.length;i++){ if ((document.myForm.elements[i].name=="col1[]") && (document.myForm.elements[i].checked)) { count++; } } if (count!=10){ alert("選択数は10個にして下さい。"+count+"個が選択されています。"); return; } else { document.myForm.submit(); } } // --> </SCRIPT> </head><body> <form name='myForm' action='test2.php' method='post'> <?php $logfile = './logdata.txt'; $fp = fopen($logfile, "r"); while($str = fgetcsv($fp)){ $data1[] = $str[0]; $data2[] = $str[1]; } fclose($fp); for ($i = 0; $i < sizeof($data1); $i++){ print "<input type='checkbox' name='col1[]' value='$data1[$i]'>"; print "<input type='text' name='col2[]' value='$data2[$i]' >"; print "<br>"; } ?> <input type='button' value='実行' onClick="CBCheck()"> </form> </body> </html>
その他の回答 (1)
- SAYKA
- ベストアンサー率34% (944/2776)
勘違いしていると思われる点 ・phpはサーバサイド サーバ側で完全処理を行ってできあがったHTMLをユーザへ送り出す ・javascriptはクライアントサイド ユーザ処理をjavascriptで返す場合は判別もjavascript またはajax的にjavascriptで判別phpへ投げて受け取る必要有り 要するにcheckboxの選択云々の確認は ・javascript判別 javascriptでformを走査しalert ・php判別 一旦post(またはget)してphpとして「エラーページ」 が 妥当じゃないのかな。
補足
返答有難う御座います。 やはりこのPHPと同じ1枚のページに作成するのは不可能になりますでしょうか。ダラダラと長いスクリプトになってしまうかもしれない事は 覚悟しているのですが。 認識が乏しくて申し訳ありません。
関連するQ&A
- チェックボックス連結
MySQLで、perlを使ってチェックボックスでデータを送信するのですが、 カラムを分けずに、チェックボックスで複数選択されたデータを、；などの仕切りで同一フィールドへ記録したいのですが、やり方がわかりません。 <input type = checkbox name = col1 value="1"> <input type = checkbox name = col1 value="2"> <input type = checkbox name = col1 value="3"> <input type = checkbox name = col1 value="4"> 結果 col1 |col2 | +-------------- 1;2;3;4| | のような感じです。よろしくお願いします。
- ベストアンサー
- MySQL
- ＣｈｅｃｋＢｏｘの入力チェックについて
CheckBoxの入力チェックについて CheckBoxの数は可変です。 全て未チェックのときにalertを表示したいです。 今はチェックしてもalertが表示されてしまいます。 よろしくお願いします。 <html> <head> <meta http-equiv="Content-Language" content="ja"> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <meta name="GENERATOR" content="Microsoft FrontPage 4.0"> <meta name="ProgId" content="FrontPage.Editor.Document"> <title>チェックボックス入力チェック</title> <SCRIPT TYPE="text/javascript"> <!-- function item_check() { count = 0; for (i=0;i<=document.form1.elements['item[]'][i].length;i++){ if(document.form1.elements['item[]'][i].checked){ count++; } } if(count==0){ alert("項目を選択してください。"); return(false); } return(true); } --> </SCRIPT> </head> <body> <form name="form1" method="POST" action="test.htm" onSubmit="return item_check()"> <p><input type="checkbox" name="item[]" value="1">項目1</p> <p><input type="checkbox" name="item[]" value="2">項目2</p> <p><input type="checkbox" name="item[]" value="3">項目3</p> <p><input type="checkbox" name="item[]" value="4">項目4</p> <p><input type="checkbox" name="item[]" value="5">項目5</p> <input type="submit" name="kakunin" value="確認"> </form> </body> </html>
- ベストアンサー
- JavaScript
- javascript 要素取得
htmlでチェックボックスを作り、その値をjavascriptで取得したいと思い、 下記のようなプログラムを書きました。 セレクトボックスから複数選択できるようにしたいのですが、 表示されるのは複数選んだ際に一番初めに選択したものだけです。 例) 「あああ」と「いいい」を選ぶと「あああ」のみ表示される。 しかし、これを「あああ.いいい」としたいのです。 できれば、 「あああ いいい」 と改行できるといいです。 formの中にたくさんの項目があるため、 forのところがうまくいっていないのでしょうか？ どなたかよろしくお願いします。 javascript側 function checkbox(){ var str=""; for(i=0;i<document.form1.elements.length;i++){ if(document.form1.elements[i].checked){ if(str != "") str = str + "."; str = str + document.form1.document[i].value; } } if(str == ""){ alert("入力してください"); return false; }else{ document.form1.submit(); } } HTML側 <form action="<%=遷移先ページ%>" method="post" name="form1"> <select 複数> <input 複数> <input type="checkbox" name="document" value="・あああ"/>あああ <input type="checkbox" name="document" value="・いいい"/>いいい <input type="checkbox" name="document" value="・ううう"/>ううう <input type="submit" value="Submit" onclick="return checkbox();">
- 締切済み
- JavaScript
- checkbox の入力チェックのやり方について
お世話になります。 フォームにて、 javascriptで、入力チェックをおこないたいと思っています。 チェックボックスについては、どれか選択が一つでもなければ、アラートで、文字を出したいと思いますが、うまくできません。 チェックボックスの入力確認の方法を教えてください。 よろしくお願いいたします。 現在作りかけのソースは、下記の通りです。 <html> <head><title>-</title></head> <body> <form method="post" action="" onsubmit="return form_Validator(this)"> <input type="text" name="a1" size="15" maxlength="12"> <BR> <input type="checkbox" name="a1001" value="1"> <input type="checkbox" name="a1002" value="1"> <input type="submit" value="登録" name="submit"> </form> <script Language="JavaScript"> <!-- function form_Validator(doc) { if ( doc.a1.value == "" ) { alert( "BAD" ); return false; } /* a1001かa1002のチェックボックスのチェックがなければアラート----*/ return (true); } //--> </script> </body> </html>
- ベストアンサー
- JavaScript
- チェックボックス 連結
恐れ入ります。 <input type=checkbox name=col1 value="1"> <input type=checkbox name=col1 value="2"> <input type=checkbox name=col1 value="3"> <input type=checkbox name=col1 value="4"> <input type=checkbox name=col1 value="5"> を、 1;2;3;4;5 と連結して同一フィールドへ送信し、 読み込み時に 分割して読み込みたいのですが、どのようにしたら良いでしょうか。 よろしくお願いします。
- 締切済み
- Perl
- 大量のcheckboxにcheckedを入れる
チェックボックスが50個あります。 送信ボタンを押して元のページを再度開きます。 そのときにチェックしたボックスにチェックを入れた状態にしたいです。 inputタグの中に<?php if(isset($checkbox2) && in_array('b2',$checkbox2)){echo ' checked';} ?>を入れていますが単調になってしまいます。 単調にならずにする方法はありますか？ <input type="checkbox" name="chk1[]" value="a1" />の場合はインデックスが固定でないのでできませんでした。 その他いけない箇所があれば教えて下さい。 お願いします。 <?php if(isset($_GET["chk1"])){ $checkbox1 = $_GET["chk1"]; for($i=0; $i<sizeof($checkbox1); $i++){ print $checkbox1[$i]."<br />"; } } if(isset($_GET["chk2"])){ $checkbox2 = $_GET["chk2"]; foreach($checkbox2 as $key => $val){ print $val."<br />"; } } ?> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> </head> <body> <form method="get" action="checkbox.php"> <input type="checkbox" name="chk1[]" value="a1" /> <input type="checkbox" name="chk1[]" value="a2" /> <input type="checkbox" name="chk1[]" value="a3" /> <input type="checkbox" name="chk1[]" value="a4" /> <input type="checkbox" name="chk1[]" value="a5" /> <input type="checkbox" name="chk1[]" value="a6" /> <input type="checkbox" name="chk1[]" value="a7" /> <input type="checkbox" name="chk1[]" value="a8" /> <input type="checkbox" name="chk1[]" value="a9" /> <input type="checkbox" name="chk1[]" value="a10" /> <br /> <input type="checkbox" name="chk2['b1']" value="b1" <?php if(isset($checkbox2) && in_array('b1',$checkbox2)){echo ' checked';} ?>/> <input type="checkbox" name="chk2['b2']" value="b2" <?php if(isset($checkbox2) && in_array('b2',$checkbox2)){echo ' checked';} ?>/> <input type="checkbox" name="chk2['b3']" value="b3" <?php if(isset($checkbox2) && in_array('b3',$checkbox2)){echo ' checked';} ?>/> <input type="checkbox" name="chk2['b4']" value="b4" <?php if(isset($checkbox2) && in_array('b4',$checkbox2)){echo ' checked';} ?>/> <input type="checkbox" name="chk2['b5']" value="b5" <?php if(isset($checkbox2) && in_array('b5',$checkbox2)){echo ' checked';} ?>/> <input type="checkbox" name="chk2['b6']" value="b6" <?php if(isset($checkbox2) && in_array('b6',$checkbox2)){echo ' checked';} ?>/> <input type="checkbox" name="chk2['b7']" value="b7" <?php if(isset($checkbox2) && in_array('b7',$checkbox2)){echo ' checked';} ?>/> <input type="checkbox" name="chk2['b8']" value="b8" <?php if(isset($checkbox2) && in_array('b8',$checkbox2)){echo ' checked';} ?>/> <input type="checkbox" name="chk2['b9']" value="b9" <?php if(isset($checkbox2) && in_array('b9',$checkbox2)){echo ' checked';} ?>/> <input type="checkbox" name="chk2['b10']" value="b10" <?php if(isset($checkbox2) && in_array('b10',$checkbox2)){echo ' checked';} ?>/> <br /> <input type="submit" value="送信" /> </form> </body> </html>
- 締切済み
- PHP
- 複数あるチェックボックスの入力チェックするには？
チェックボックスの入力チェックスクリプトを探しており、下記のようなスクリプトをネット検索で見つけました。 <!-- <script type="text/javascript"> function chNull(msg,obj) { if(!obj) return true; if((obj.type || obj[0].type) == 'checkbox'){ var flag = 0; if(obj.length){ for(var i=0; i<obj.length; i++) { if(obj[i].checked) flag = 1; } } else { if(obj.checked) flag = 1; } if(flag == 0) { alert(msg + 'を選択してください。'); return false; } } return true; } --> </script> <form method="POST" action="■.cgi" onSubmit="return chNull('チェックボックス',a);"> <input type="checkbox" name="a" value="A1" />A1 <input type="checkbox" name="a" value="A2" />A2 </form> 同じnameのチェックボックス群がひとつしかないときはこれで問題ないのですが、 下記のようにnameが複数ある場合にはこのスクリプトのどの部分を変えればよいのでしょうか？ <input type="checkbox" name="a" value="A1" />A1 <input type="checkbox" name="a" value="A2" />A2 <input type="checkbox" name="b" value="B1" />B1 <input type="checkbox" name="b" value="B2" />B2 <input type="checkbox" name="c" value="C1" />C1 <input type="checkbox" name="c" value="C2" />C2 できればこのスクリプトをベースとして使用したいと思っています。どなたかお分かりの方がいらっしゃいましたらお教え下さいませ。 よろしくお願い致します。
- ベストアンサー
- JavaScript
- checkbox 特定項目だけを、チェックするには
こんにちは。いつもお世話になります。 checkbox内で、同じnameの中から特定のものだけ チェックさせるにはどうしたら良いでしょうか。 条件として、name='or52'の部分は変更出来ません。 <input type='button' value='A,B,Cだけを同時にチェック' onclick='checkAll();'> <form action='xxx.cgi' method='post' name='f1'> <input name='or5' type='checkbox' value='A'><br> <input name='or5' type='checkbox' value='B'><br> <input name='or5' type='checkbox' value='C'><br> <input name='or5' type='checkbox' value='D'><br> <input name='or5' type='checkbox' value='E'><br> <input name='or5' type='checkbox' value='F'><br> ......... </form> それで、こんなのをウェブから探してきました。 function checkAll() { for (i=0; i<7; i++) document.f1.elements["or52"+i].checked = true; } そして、同時にチェックしたいものだけ下記の様にしました。 <input name='or52' type='checkbox' value='A' id='or51'> <input name='or52' type='checkbox' value='B' id='or52'> <input name='or52' type='checkbox' value='C' id='or53'> 取りあえずできますが、エラーがでます。 「document.f1.elements["..."]は、objまたはnullではない！」 どうか教えて下さい。よろしくお願いします。
- ベストアンサー
- JavaScript
- []を付けずにcheckboxの値を複数受信
カテゴリをPHPとするか迷いましたが、 こちらに質問させていただきます。 <input type="checkbox" name="hiragana[]" value="a">あ <input type="checkbox" name="hiragana[]" value="i">い <input type="checkbox" name="hiragana[]" value="u">う とした場合、 $checked=$_POST['hiragana']; print_r($checked); などとして使えることはわかるのですが、 角括弧をつけず、 <input type="checkbox" name="hiragana" value="a">あ <input type="checkbox" name="hiragana" value="i">い <input type="checkbox" name="hiragana" value="u">う としたときに、同様に配列として取得する(すべてのチェックされた項目を取得する) 方法はあるのでしょうか？ このようにした場合、 $checked=$_POST['hiragana']; print_r($checked); や print_r($_POST); すると、最後にチェックされた値しか入っていないようです。 (上書きされているようですが...) HTTPヘッダを見ると、 hiragana=a&hiragana=i&hiragana=u のように、すべて送信はされているのは確認できるのですが... 後者のような角括弧をつけていないタイプのcheckboxを使って ちゃんとチェックされた値をすべて受信して動作していると 思われるサイトを目にするので どうすればできるのかと思い質問させて頂きました。 よろしくお願いいたします。
- ベストアンサー
- HTML
- checkboxの選択数制限と排他処理について
javascript初心者です。よろしくお願い致します。現在チェックボックスを使用したクイズサイトを作成しており、回答が５つの中から正しいものをチェックし送信するというものです。 その中で、正解数（今回は2つ）以上にチェックをした時に最初にチェックした方のチェックボックスのチェックが外れるという仕組みを組み込む事になりました。 選択数に制限をかけることや排他処理（ラジオボタン）は理解できるのですが、上記の実現方法がどうしても分からず質問させていただきました。 どうかよろしくお願い致します。 <html> <head> <script type="text/javascript"> function check(f,o,m){ var c = i = 0, b = f.elements; for (i; i < b.length; i++) if(b[i].type&&b[i].type=='checkbox'&&b[i].checked&&b[i].parentNode.id==o) c++; for (i = 0; i < b.length; i++) if(b[i].type&&b[i].type=='checkbox'&&!b[i].checked&&b[i].parentNode.id==o) b[i-2].checked=false;// これだと２つ前ではなく2番目のチェックボックスが排他になります。 } </script> </head> <body> <form action="#" id="sampleform" onclick="check(this,'options',2);"> <fieldset id="options"><input type="checkbox" name="" value=""><br> <input type="checkbox" name="" value=""><br> <input type="checkbox" name="" value=""><br> <input type="checkbox" name="" value=""><br> <input type="checkbox" name="" value=""><br> <input type="checkbox" name="" value=""><br> </fieldset> </form> </body> </html>
- ベストアンサー
- JavaScript
お礼
回答有難う御座います。 イメージしていた画面遷移をさせる事が出来ました。 とても勉強になりました。 本当に有難う御座いました。