ひとつのボタンから複数の情報を送る (HTMLでPOST、そしてhidden)

formでユーザの入力やファイルを送信する際、IDを付与したり、送信した情報を紐付けるか、などの情報を一緒に送信したい場合があります。
その場合、ID情報はブラウザに表示しないのがベストです。ユーザに見せたり、編集してもらう必要はありません。

 わたしの場合、10個の画像が並んだ画像一覧ページで、画像ひとつずつにコメント欄があり、どの画像に対するコメントなのか特定する必要がありました。

「画像にコメントを付けられるサイト」のスクリーンショット(一部を切り出したもの)

追記：「fancyBoxで装飾したフォームからPOSTを送信する」方法とサンプルコードを公開しました。


formによる送信は、送る側でnameとvalueを指定すると、受け取る側で$_POST連想配列の中身として情報を受け取れる、という仕組みになっています。
例：
送信する側 (HTML)
    <input name="name" value="string value or other.">
受信する側 (PHP)
    $inValue = $_POST["name"];
 
今回の場合、情報をまとめて送り、受け取る側では、$_POSTを配列として扱うことで、
    //画像に対するコメントを保存
    saveComment ($_POST["imagename"], $_POST["comment"]);
などと書きたいわけです。

これを実現する方法として、 inputタグのtype="hidden" を使います。
ユーザを惑わせることなく、複数の情報を同時に送信できるようになります。


なお、検索すると、JavaScriptでpostするという解決法が出てきますが、そんなに大げさなことをする必要はありません。(それに、JavaScriptが無効にされていたら情報が送信できなくなります。)

POST(GETでもよいですが)で送信する側

HTMLで以下のように書きます。
例：
    <form action="capture_post.php" method="post">
        <p>
        コメント：<br>
        <input type="hidden" name="imgname" value="samplefile.png">
        <textarea name="comment" rows="3" cols="30"></textarea><br>
        <input type="submit" name="button">
        </p>
    </form>
なお、この例ではPOSTを受け取るページ(formタグのactuon要素)はcapture_post.phpとなっています。action="#"と書くことで、このページ自身をPOSTの受け取りページとして指定することもできます。
ボタンを押すと、ブラウザは新しいページを要求しながらPOSTデータを送ります。ページ側では、次の「受け取る側」PHPコードを書いて、POSTデータを受け取ります。

受け取る側

HTML中のPHPで以下のように書きます。
この例では、コメントがあった際に、指定されたファイル名と書き込まれたコメントを表示しています。
例：
  function capture_comment(){
      if ("" == $_POST["comment"]){
          return false;
      }
      print "コメント：" . $_POST["imgname"] . "<br>\n";
      print $_POST["comment"] ."<br>\n";
  }
※本番環境で使う場合は、セキュリティのためにPOSTメッセージを変換する必要があります。

POST結果の表示例(一部を切り出したもの)

上のスクリーンショットはPOSTテストのための簡単な表示です。
実際にコメントをサイトに表示する際には、もっと見やすくてわかりやすいデザインをする必要があります。