FORMタグの中の2つのボタンの処理について

このQ&Aのポイント
  • PHPを使ったWebページで、FORMタグ内に2つのボタンを配置し、ボタンが押された時にそれぞれのフレームの内容を更新する処理を実装したいです。
  • 具体的には、ボタン1が押された場合には下側のフレームの内容を、ボタン2が押された場合には上側のフレームの内容を書き換えたいです。
  • 現在は下側のフレームの更新処理は実装できていますが、上側のフレームの更新処理の実装方法がわかりません。どのように記述すればいいですか?
回答を見る
  • ベストアンサー

FORMタグの中の2つのボタンの処理について

PHPの勉強を始めたばかりのものです。 よろしくお願いします。 以下のようなページを作りたいと考えています。 フレームで上下に分けられたページで、上側を「upper.php」、下側を「lower.php」とします。 下側(lower.php)に3つの入力欄〔入力欄(1)〕〔入力欄(2)〕〔入力欄(3)〕と2つのボタン【ボタン(1)】【ボタン(2)】があります。 【ボタン(1)】は、〔入力欄(1)〕のデータをもとに、フレームの下側の内容を書き換えます。 【ボタン(2)】は、〔入力欄(1)〕〔入力欄(2)〕〔入力欄(3)〕の情報をもとに、フレームの上側の内容を書き換えます。 自分なりに勉強して、とりあえず、下記のようにしたのですが、上のページを更新する部分をどのようにすればいいのか分かりません。 ご教授、よろしくお願いします。 <「lower.php」の中の記述> <?php if ($_POST[Button_1]) { 下側のフレームの更新処理に関わる部分 (この部分はうまく機能しています) } elseif ($_POST[Button_2) { 上側のフレームを更新する処理 (★★この部分をどのように記述すればいいのかわかりません★★) } ?> <form action="<?=$_SERVER['PHP_SELF']?>" method="post"> <INPUT TYPE="text" NAME="INPUT_1"> <input type="submit" name="Button_1" value="登録"> // 「INPUT_1」のデータを使って、下側のフレームの内容を更新 <INPUT TYPE="text" NAME="INPUT_2"> <INPUT TYPE="text" NAME="INPUT_3"> <input type="submit" name="Button_2" value="登録"> // 「INPUT_1~3」のデータを使って、上側のフレームの内容を更新 </form> よろしくお願いします。

  • PHP
  • 回答数1
  • ありがとう数0

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

  • ベストアンサー
  • agunuz
  • ベストアンサー率65% (288/438)
回答No.1

データがPOSTされてからはどうしようもありません。 押されたボタンによってform要素のtarget属性(送信先の「フレーム名」)を書き替えてからPOSTするようにJavaScriptで処理することになります。

kevin67
質問者

補足

ご回答、ありがとうございます。 ご記入いただいた【押されたボタンによってform要素のtarget属性(送信先の「フレーム名」)を書き替えてからPOSTするようにJavaScriptで処理することになります。】が具体的に何を意味するのかは理解できなかったのですが、以下のような方法を思いついて、とりあえず、うまく動いています。 <BODY onload="document.FRM.submit();"> <?php if ($_POST[Button_1]) { 下側のフレームの更新処理に関わる部分 } elseif ($_POST[Button_2) { // 要するに、一度、別のデータで受けて、再び、POSTする。 $DATA_1 = $_POST["INPUT_1"]; $DATA_2 = $_POST["INPUT_2"]; $DATA_3 = $_POST["INPUT_3"]; ?> <FORM Name="FRM" METHOD="POST" action="upper.php" target="upper"> <INPUT TYPE="hidden" NAME="INPUT_1" VALUE="<?php echo $DATA_1; ?>" > <INPUT TYPE="hidden" NAME="INPUT_2" VALUE="<?php echo $DATA_2; ?>" > <INPUT TYPE="hidden" NAME="INPUT_3" VALUE="<?php echo $DATA_3; ?>" > </FORM> } ?> <form action="<?=$_SERVER['PHP_SELF']?>" method="post"> <INPUT TYPE="text" NAME="INPUT_1"> <input type="submit" name="Button_1" value="登録"> // 「INPUT_1」のデータを使って、下側のフレームの内容を更新 <INPUT TYPE="text" NAME="INPUT_2"> <INPUT TYPE="text" NAME="INPUT_3"> <input type="submit" name="Button_2" value="登録"> // 「INPUT_1~3」のデータを使って、上側のフレームの内容を更新 </form>

関連するQ&A

  • <form>タグに2つのボタン

    <form>タグで2つのボタンを表示させ、以下のようにそれぞれのボタンで フィールドに別の値を入れて送信させることはできますでしょうか? できれば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に複数ボタンを配置し、それぞれのボタンに対して、別の複数の値を

    formに複数ボタンを配置し、それぞれのボタンに対して、別の複数の値をPHPに受け渡したいのです。 例としは下記のような命令をしたいのですが、どうしても解決策がわかりません。 1.jpgで作成したボタンをクリックすると、textの"コンニチワ"、textの30、1.jpgが1.phpへ送られる。 2.jpgで作成したボタンをクリックすると、textの"コンバンワ"、textの50、2.jpgが1.phpへ送られる。 下記は、一応自分で作成したものです。 ●sample.html <form method="post" action="1.php"> <input name="namae"type="text"value="コンチニワ"> <input name="namae"type="text"value="コンバンワ"><br> <BUTTON type ="submit"name="submit1"> <IMG src="1.jpg"> </BUTTON> <BUTTON type ="submit"name="submit2"> <IMG src="2.jpg"> </BUTTON><br> <input name="price"type="text"value="30"> <input name="price"type="text"value="50"> -------------------------------- 【sample.htmlの希望表示】 namaeテキスト  namaeテキスト ボタン画像    ボタン画像 priceテキスト  priceテキスト -------------------------------- ●1.php <?php $namae=$_POST['namae'] $kakaku=$_POST['price'] $image=&_POST['image'] ?> もしかしたら、imageについては表示させないテキストに隠して値だけ送るという 手もあるかもしれません。やり方がわかりませんが。

    • 締切済み
    • PHP
  • 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="実行2"> </form> どなたか分かる方情報頂けますか。

    • ベストアンサー
    • HTML
  • formに複数ボタン配置と複数の値受け渡しにつきまして、下記のような命

    formに複数ボタン配置と複数の値受け渡しにつきまして、下記のような命令をしたいのですが、どうしても解決策がわかりません。 1.jpgで作成したボタンをクリックすると、textの"コンニチワ"、textの30、1.jpgが1.phpへ送られる。 2.jpgで作成したボタンをクリックすると、textの"コンバンワ"、textの50、2.jpgが1.phpへ送られる。 下記は、一応自分で作成したものです。 ●sample.html <form method="post" action="1.php"> <input name="namae"type="text"value="コンチニワ"> <input name="namae"type="text"value="コンバンワ"><br> <BUTTON type ="submit"name="submit1"> <IMG src="1.jpg"> </BUTTON> <BUTTON type ="submit"name="submit2"> <IMG src="2.jpg"> </BUTTON><br> <input name="price"type="text"value="30"> <input name="price"type="text"value="50"> -------------------------------- 【sample.htmlの希望表示】 namaeテキスト  namaeテキスト ボタン画像    ボタン画像 priceテキスト  priceテキスト -------------------------------- ●1.php <?php $namae=$_POST['namae'] $kakaku=$_POST['price'] $image=&_POST['image'] ?> もしかしたら、imageについては表示させないテキストに隠して値だけ送るという 手もあるかもしれません。やり方がわかりませんが。

  • formで複数のボタンを使いたい

    htmlの問題なので、カテゴリがhtmlかphpか迷いましたがphpで質問します。 htmlにおいて、form中にsubmitボタンを2個置きたいのです(例、修正ボタンと削除ボタン)。普通ならnameで区別しろということになり、飛び先(例えばaction=judge.php)中でnameで分岐させることになると思います。 ところが、現在phpフレームワークベースで開発しており、上記2つの処理を行うphpがすでにあるため、htmlからは、ボタンのactionによりそれぞれ別のphpを呼び出したいのです。以下に擬似コードを示しますが、以下のようにformが2つだと商品コード入力が2つになり、なんともおかしいので困っています。 form method=post action=edit.php input type=text 商品コード, input type=submit 修正 form method=post action=delete.php input type=text 商品コード, input type=submit 削除 質問のように1つのformに対して複数のsubmitを置くか、あるいは2つのformでも上記商品コードが1つであれば問題ないので、もしそのような方法があればご教示をよろしくお願いします。

    • ベストアンサー
    • PHP
  • formの入れ子の回避方法

    アドバイス下さい。 <form method="post" name="addForm" id="addForm" action="aaa.php"> <input type="text" name="textA" id="textA"> <form method="post" name="uploadFormA" id="uploadFormA" enctype="multipart/form-data" action="aaa.php"> <input type="text" name="text1" id="text1"> <input type="file" name="upload_fileA" id="upload_fileA"> <input type="button" value="アップロード"> </form> <form method="post" name="uploadFormB" id="uploadFormB" enctype="multipart/form-data" action="aaa.php"> <input type="text" name="text2" id="text2"> <input type="file" name="upload_fileB" id="upload_fileB"> <input type="button" value="アップロード"> </form> <form method="post" name="uploadFormC" id="uploadFormC" enctype="multipart/form-data" action="aaa.php"> <input type="text" name="text3" id="text3"> <input type="file" name="upload_fileC" id="upload_fileC"> <input type="button" value="アップロード"> </form> <input type="text" name="textB" id="textB"> <input type="submit" value="送信"> </form> のような、formが入れ子になってしまっているformがあります。 これを回避する方法を教えていただきたいです。 条件としては、 ・見た目はこの順番がいい。 ・javascript、CSS等なんでも良いです。 ・各「アップロード」ボタンで、text1,2,3,4、upload_fileA,B,C,Dを送信、「送信」ボタンでtextA,Bを送信したい。 以上、お願いいたします。

    • ベストアンサー
    • HTML
  • 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がよくわからないので できればサンプルコード示していただけると助かります・・・。   

  • inputタグはformタグで必ず囲む必要がありますか?

    <input type="text">や< input type="button">などのinputタグは、入力欄に入力されたデータを他のファイルに送らずに同ファイル内で処理する場合も、必ず<form></form>で囲む必要があるのでしょうか? 例えば、<input type="text" id=”background_color”>に色(例:赤、青等)を入力し< input type="button" value=”変更” onClick=”change_background()”>ボタンを押すと、バックグラウンドの色が入力された色に変わるようなコードを書くとします。Javascript(change_background())の内容は同ファイルの<header></header>内に記述しますが、ここでは関係ないので割愛します。 この場合、 <body> <input type="text" id=”background_color”> < input type="button" value=”変更” onClick=”change_background()”> </body> で良いのでしょうか? それとも <body> <form> <input type="text" id=”background_color”> < input type="button" value=”変更” onClick=”change_background()”> </form> </body> とする必要が、ありますか? よろしくお願いします。

    • ベストアンサー
    • HTML
  • formでPOSTするのと同じ動作をボタンとjavascriptで実現したいのですが

    <form name="myFORM" method="POST" action="xxx.php"> <input type="text" name="NAME"> <input type="submit" value="送信"> </form> 上記と同じ動作を <button onclick="fpost('tanaka','POST','xxx.php')">送信</button> とjavascriptで実現したいのですが可能でしょうか? 可能でしたらどのようなスクリプトになりますでしょうか? document.myFORM.submit();とかではなく、formタグを全く使わずPOSTしページ遷移したいのですが。 XMLHttpRequestとlocation.replace()とかでできるのでしょうか?? すみませんがよろしくお願い致します。

  • 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