同じformタグの中にあるボタンで別々のページに遷移したい（ブラウザ依存を考慮）
- 現在、ショッピングサイト構築の勉強をしています。同じformタグの中にあるボタンで別々のページに遷移したい方法を教えてください。
- 現在のコードでは、Bボタンを押すとng.jspに遷移し、Cボタンを押すとAとCの値をok.jspに送信します。しかし、JavaScript未対応の場合にも正常に遷移できる方法がわかりません。
- JavaScriptを使用せずに、同じformタグの中にあるボタンで別々のページに遷移する方法を教えてください。
- ベストアンサー
同じformタグの中にあるボタンで別々のページに遷移したい（ブラウザ依存を考慮）
はじめまして。 現在、ショッピングサイト構築の勉強をしています。その中で、わからない点がありましたので、皆様に教えて頂ければ幸いです。 【したいこと】 現在書いているコードは以下の通りです。 <html> <head> </head> <body> <form method="post" action="ok.jsp"> <input type="text" name="A"> <input type="submit" value="B"> <input type="submit" value="C"> </form> </body> </html> やりたいことは、 「Cが押された場合は、AとCの値をok.jspに送信」 「Bが押された場合は、Bの値のみをng.jspに送信」 できるようにすることです。 ちなみに、画面レイアウトの関係で、A,B,Cの順番は変えれません。 JavaScriptを使用して ＜略＞ <form method="post" action="ok.jsp"> <input type="text" name="A"> <input type="submit" value="B" onClick="location='ng.jsp';return false"> <input type="submit" value="C"> </form> のように記述すると、JavaScriptを許可している場合は実現できました。ただ、JavaScript未対応（拒否）の場合にも実現できる方法がわかりません。このままの記述だと、未対応の場合はok.jspに遷移してしまいます。 何か良い方法をご存知の方がいらっしゃいましたら、是非教えてください。よろしくお願いします。
- rerunerune
- お礼率0% (0/1)
- JavaScript
- 回答数1
- ありがとう数0
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
> ただ、JavaScript未対応(拒否)の場合にも実現できる方法がわかりません。 JavaScript未対応の場合、HTMLの記法に則ります。 なので、jsp側を修正するしかないと思います。 submitボタンにname属性を与えて、ok.jsp の中で判断してください。 // HTML <input type="submit" name="hoge" value="B"> <input type="submit" name="hoge" value="C"> // ok.jsp hoge=B だったら、従来通り ok.jsp の処理をする hoge=C だったら、ng.jsp の処理をする。あるいは、ng.jsp にリダイレクトする。 submitに2つのアクションを起こすことは可能でしょうか？ http://www.tohoho-web.com/lng/200001/00010333.htm この場合、JavaScriptを使う必要がなくなります。
関連するQ&A
- FORMで送信ボタンと戻るボタンを2つつけてそれぞれ遷移先を変えたい
以下のような画面を作りたいのですが↓ -------------------------------------------------------------------------------- ● a.php （ユーザ情報入力画面） ※フォームに入力する画面 <FORM method="POST" action="b.php"> <INPUT type="text" name="mail"> <INPUT type="submit" name="submit" value="確認"> </FORM> ● b.php （ユーザ情報入力確認画面）※フォームに入力された値を表示する画面 <FORM method="POST" action="c.php"> <!-- ここには、フォームに入力された値を表示する --> <INPUT type="submit" name="submit" value="登録"> // c.php に遷移する <INPUT type="submit" name="submit" value="戻る"> // a.php に戻る </FORM> ● c.php （完了画面） -------------------------------------------------------------------------------- b.php について質問なのですが、 b.phpにおいて、登録ボタンと戻るボタンを2つつけて、 それぞれ遷移先を変えたいのですが、どうすればいいんでしょうか・・・？ <FORM method="POST" action="c.php">と書いてしまうと、 戻るボタンを押しても戻らずに、c.phpに遷移してしまいますよね？？ こういう場合ってJavaScriptとかで遷移先を指定するんですか・・？ もしそうでしたら、JavaScriptがよくわからないので できればサンプルコード示していただけると助かります・・・。
- ベストアンサー
- その他（プログラミング・開発）
- <form>タグに２つのボタン
<form>タグで２つのボタンを表示させ、以下のようにそれぞれのボタンで フィールドに別の値を入れて送信させることはできますでしょうか？ できればHTMLで、できなければJavaScriptでできますでしょうか？ ・button1を押したときは フィールド「CASE」に1を入れて送信、 HTMLで書くと、<input type="hideen" name="CASE" value="1"> ・button2を押したときは フィールド「CASE」に2を入れて送信、 HTMLで書くと、<input type="hideen" name="CASE" value="2"> ===== HTML ====================== <form action="test.cgi" method="post"> <input type="text" name="text1"> <input type="submit" value="button1"> <input type="submit" value="button2"> </form> 宜しくお願いします。
- ベストアンサー
- HTML
- formタグ
HTMLで、formを使用し、CGIへテキストエリアのデータをpostしたいと 考えております。 テキストエリアを3つ、ボタンを1つ設けるならば 通常以下のようにすると思います。（必要部分の抜粋） <form action="foo1.cgi" method="post" ENCTYPE="multipart/form-data"> <input type="text" name="text1" value="text1" size=50 maxlength=100> <input type="text" name="text2" value="text2" size=50 maxlength=100> <input type="text" name="text3" value="text3" size=50 maxlength=100> <input type="submit" name="aaa" value="実行"> </form> こうすると、実行ボタンをクリックすると、text1、text2、text3のテキストエリアに 記述されているテキストが送信されますが、ここにボタンをもう一つ設け、 上記3つのデータを別のCGIに送信したいのですが、 この場合どのようにHTMLを記述したらよいでしょうか？ 新たに下記のようにformタグを設けると、テキストエリアは6つになってしまいますし。。。 <form action="foo2.cgi" method="post" ENCTYPE="multipart/form-data"> <input type="text" name="text1" value="text1" size=50 maxlength=100> <input type="text" name="text2" value="text2" size=50 maxlength=100> <input type="text" name="text3" value="text3" size=50 maxlength=100> <input type="submit" name="aaa" value="実行２"> </form> どなたか分かる方情報頂けますか。
- ベストアンサー
- HTML
- <FORM> </FORM> の中に さらに <FORM> </FORM>があるときのSUBMITボタンについて
今、 <FORM ACTION="aaa.asp" METHOD="POST" Name="form1"> <input type="SUBMIT" value="ボタン１"> <FORM ACTION="bbb.asp" METHOD="POST" Name="form2"> <input type="SUBMIT" value="ボタン2"> </FORM> </FORM> としていて、ボタン２を押すとbbb.aspに 飛んでほしいのでに、aaa.aspに飛んでしまいます。 こういう場合どのようにすればよいのでしょうか？ それぞれのボタンは hidden の値をそれぞれの フォームの中の値を渡したいので どうしてもSubmitがいいのです。
- ベストアンサー
- HTML
- formの中で別のactionをもったsubmitボタンの設置。
formの中で別のactionをもったsubmitボタンの設置。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=EUC-JP"> <title>sample</title> <script language="JavaScript" type="text/javascript"> <!-- //＜クリックした時に実行される関数＞ //*** 確認画面A function func1(form){ document.form1.check[].value =form.check[].value; document.form1.submit(); } //*** 確認画面B function func2(form){ document.form2.check[].value =form.check[].value; document.form2.submit(); } //--> </script> </head> <body class="index"> <form enctype="multipart/form-data"> <input type="check" name="test[]" value="0">0 <input type="check" name="test[]" value="1">1 <input type="check" name="test[]" value="2">2 <input type="button" onClick="func2(this.form)" value="確認B"> <input type="button" onClick="func1(this.form)" value="確認A"> </form> <!-- sousin.php画面へ --> <form method="post" name="form1" action="sousin.php" enctype="multipart/form-data"> <input type="hidden" name="check[]"> </form> <!--- text.php画面へ ---> <form method="post" name="form2" action="text.php" enctype="multipart/form-data"> <input type="hidden" name="check[]"> </form> </body> </html> 上記のように記述し、フォームの中に別のactionをもったsubmitボタンを設置しました。 チェックボックスで何と何がチェックされたかを渡したいのですが、エラーが発生します。 おそらくjavascript内の構文でcheck[]と記述してるからだと思いますが、 どのようにすれば受け渡すことができるのでしょうか。 checkのみにすると1つの値しか渡せません。
- ベストアンサー
- HTML
- </form>タグを使用すると強制的に改行されてしまいます・・・
<FORM action="http://log.cgi" method="post"> <INPUT type="submit" value="ｂ1"></FORM> <FORM> <FORM action="http://log2.cgi" method="post"> <INPUT type="submit" value="ｂ2"></FORM> とすると，強制的に改行されてしまい何とか，ボタンを，並列することは出来ないでしょうか？
- ベストアンサー
- HTML
- formのボタンをsubmitしたときにアラート
javascript で、formのボタンをsubmitしたときに アラートが出るようにしたいと思います。 下記のように作ってみましたが、うまく動きません。 どのようにすれば動くでしょうか? ご教示いただきたくお願いいたします。 <script type="text/javascript"> function(){ $('form1').submit(function(){ $.ajax({ type: 'POST', data: postData, url: 'buy.php', success: function(data){alert("購入できました");} error: function(){alert('購入できませんでした。再度お試しください');} }); return false; }); } </script> <form name="form1" id="form1" method="POST" name="form1" value="form1" action="buy.php"> <input type="hidden" name="id" value="100" /> <input type="hidden" name="name" value="高橋" /> <input type="submit" value="Save"> <form/>
- ベストアンサー
- JavaScript
- tableタグとformタグの組み合わせ
tableタグとformタグの組み合わせでどのように記述すれば、構文上正しいのでしょうか？ 私は下のパターンで書いておりますが、間違いでしたら早めに改めたいので お聞きしました。 ＜table＞ ＜form＞ ＜input type="hidden" name="a" value="1"> ＜tr＞ ＜td＞ ＜input type="text" name="b" value=""＞ ＜/td＞ ＜/tr＞ ＜tr＞ ＜td＞ ＜input type="submit" value="OK" value=""＞ ＜/td＞ ＜/tr＞ ＜/fomr> ＜/table＞
- ベストアンサー
- HTML
- 2つのFormタグの動作について
同じページに2つのFormタグを設置したいと考えています。ページが長いため、上部と下部それぞれにFormタグを設置したいと考えています。 <form name="upForm" action="xxx.cgi" method="post"> <input type="text" name="name1"> <input type="submit" value="送信"> </form> --------------- 他の処理 --------------- --------------- 他の処理 --------------- --------------- 他の処理 --------------- <form name="downForm" action="xxx.cgi" method="post"> <input type="text" name="name1"> <input type="submit" value="送信"> </form> 下のFormの送信ボタンを押すと、上のFormが動作しているようで、下のFormの入力値が反映されません。それぞれのFormをそれぞれの送信ボタンで動作させる方法につきまして、ご存知の方がいましたらぜひ教えていただきたいと思います。 よろしくお願いいたします。
- ベストアンサー
- CGI
- 5個のFormタグを1つのFormタグでまとめたい
<form method="POST" action="jan_Edit.asp" id=form2 name=form2> <input type="hidden" name="a" Value =<% = YY1 %> > ～</form> <form method="POST" action="jan_Edit.asp"> <input type="submit" value="This Month"> </form> <form method="POST" action="jan_Edit.asp" id=form2 name=form2> <input type="hidden" name="a" Value =<% = YY2 %> >～</form> 現在、カレンダーを作成しています。上記（3つしか乗せてませんが同じ内容） 変数は YY1＝1年前の月初 MM1＝1か月前の月初 MM2＝1ヶ月後の月初 YY2＝1年後の月初で インプットタイプでサブミットを使用しています。端的にいうと、現在Formを5個使って月次、年次でカレンダーを作ってます しかし、Formがこれだけ並んでたら、かっこ悪いので１つのForm文でまとめれたらと 思ってますがなかなかグーグル先生でもみつかりません。 Formを一つにまとめれたらと思いますが、どなたか知恵をおかしください。
- ベストアンサー
- HTML
補足
早速のご回答ありがとうございます。 一旦全部の値をok.jspに送信して、その中でrequest.getParameter("hoge")をして判断するということですよね？ちなみに、リダイレクトするのは、JSPの中でRequestDispatcher rd = request.getRequestDispatcher("ng.jsp");rd.forward(req, res);すればできるのでしょうか？ また、教えていただいたリンク先を拝見しましたが、JavaScriptを使用せずにどのようにすればよいのか、理解することができませんでした（本当に、初心者ですので）。onClick,onSubmitなどはJavaScriptですよね？もし、よろしければ、具体的なコードを書いてくださると非常に助かります。 質問ばかりで申し訳ないのですが、もうしばらくお付き合いくださると幸いです。