- ベストアンサー
javascriptのsubmitを使ってデータをpost送信する方法
- aaa.phpというファイルに複数のチェックボックスがあり、リンクをクリックしたときにチェックされた値のみをbbb.phpへ引き渡したいです。
- チェックボックスの数は固定ではなく変動があり、値も実際はランダムです。
- デザインの都合上どうしてもaタグでしか記述が出来ません。
- laundry77
- お礼率72% (29/40)
- JavaScript
- 回答数3
- ありがとう数6
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
onClick="send()"と定義されていますが、関数はmailformしか定義されていません。 (きっとどちらかが正しいのでしょう) 1.checkboxのnameを全て配列化する。 name="no" → name="no[]" 2.checkboxのエレメント取得処理を変更する。 var chk = document.getElementsByName('no[]'); または、 var chk = document.form1.elements; 3.onClick="send()"をonClick="mailform()"とする。 (これは、どちらが正しいかによりますね。)
その他の回答 (2)
- think49
- ベストアンサー率59% (285/482)
これでどうでしょうか？ 全てのcheckboxにチェックが入っていたら、submit() する - jsdo.it http://jsdo.it/think49/kZcL > デザインの都合上どうしてもaタグでしか記述が出来ません。 デザインはCSSで管理してください。 input要素をa要素のデザインに出来ます。
お礼
ご回答ありがとうございます。 御礼が遅くなり申し訳ございませんでした。 教えていただいたURLをみてみました。 私がやりたいことは、チェックが入ったチェックボックスの値だけをPOSTしたかったので 少し違いましたが、リンク先のソースを参考にさせていただき、無事解決できました。 aタグでの記述もできました。 ご回答、本当にありがとうございました。
- yyr446
- ベストアンサー率65% (870/1330)
下記のような事がしたいのですか？ <script type="text/javascript"> function send() { var i = 0; var chkvalue = ""; var count = 0; var chk = document.querySelectorAll('form[name="form1"] input[type="checkbox"]'); for(i=0; i<chk.length; i++) { if (chk[i].checked == true) { chkvalue += chk[i].value; count++; } } if(count == 0) { alert("チェックされていません。"); return false; } else { document.form1.action = "./bbb.php"; document.form1.method="post"; document.form1.submit(); } } </script> </head> <body> <a href="#" onClick="send()">bbb.phpへ遷移する</a> <form name="form1"> <input type="checkbox" name="no[1]" value="1"><br /> <input type="checkbox" name="no[2]" value="2"><br /> <input type="checkbox" name="no[3]" value="3"><br /> <input type="checkbox" name="no[4]" value="4"><br /> </form> </body>
お礼
早速ご回答頂き、ありがとうございます。 「document.querySelectorAll」がどのようなものなのか調べましたがわからず とりあえずそのままコピーして使わせていただきましたが 「オブジェクトでサポートされていないプロパティまたはメソッドです」とエラーがでてbbb.phpへ遷移しなくなってしまいました。
お礼
ご回答いただきありがとうございます。 お礼が遅れ申し訳ありません。 mailform()をsend()とよくみたらすぐに分かる部分を間違えており、恥ずかしい限りです。 mailform()が正しいのでonClick="mailform()"と修正し、 ＞1.checkboxのnameを全て配列化する。 ＞2.checkboxのエレメント取得処理を変更する。 の部分も直しました。 それと別に、チェックが１つだけの時にうまくいかなかったので その処理を追記したところ、うまく動くようになりました。 とても丁寧にアドバイスいただきありがとうございました。