(105) 複数の submitボタンを判別する。

投稿者: | 2021年3月6日

1. やりたいこと

一つの入力フォームに、複数の submitボタンを置きたいときがしばしばある。

入力パラメーターの nameや valueで判別すればよいのだが、
以下のように、[編集]ボタンを列挙したいケースでちょっと迷ったので備忘録。

ちなみに…
初めてこれが必要な場面に遭遇した時には、
すべての submitを独立させるために、それぞれを formで囲む
という強引な方法で実装した。

radioで選択して submitさせればよいのでは?
と思うかもしれないが、ひと手間増えて 2アクションになるので、操作感が悪化すると感じてしまう。

2. やってみる

方法1 : name属性値に識別子を連結する。

1) submitボタンの name属性に、各[編集]対象の物の識別子を連結する。
 Edit_{識別子} のようにする。

2) 入力パラメータで value=[編集] の物を探し、その nameから識別子を抽出する。

以下に実装したものを置いた。
https://www.dogrow.net/hp/sample/00105/

index.php
6行目の var_dump はパラメーターを見たかっただけなので、実際の動作には不要な命令だ。

<?php
main();
exit;

function main(){    // 主制御
  var_dump($_POST);           // パラメーターをダンプして眺めてみる。
  $html_add = '';
  $ary_key = array_keys($_POST, '編集');
  if(count($ary_key) > 0){    // [編集]ボタンが押された?
    $key = $ary_key[0];
    $id = explode('_', $key)[1];
    $html_add = '<p>[編集]ボタン'.$id.'番が押されました。</p>';
  }
echo <<< EOM
<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="utf-8" />
  <link rel="stylesheet" href="style.css" />
</head>
<body>
  {$html_add}
  <form target="" method="post">
    <input type="submit" name="Edit_1" value="編集"><br />
    <input type="submit" name="Edit_2" value="編集"><br />
    <input type="submit" name="Edit_3" value="編集"><br />
    <input type="submit" name="Edit_4" value="編集"><br />
    <input type="submit" name="Edit_5" value="編集">
  </form>
</body>
</html>
EOM;
}

方法2 : name属性値を配列にする。

方法1でもやりたいことを実現できた。
でもなんだか ちょっとダサい…

name属性は配列にできるので、これを利用すればもっとスマートに実現できそうだ。

1) submitボタンの name属性を配列にし、そのインデックスに識別子を使う。
 Edit[{識別子}] のようにする。

2) 入力パラメータで name=Edit の物を探し、その配列インデックス値から識別子を取得する。

以下に実装したものを置いた。
https://www.dogrow.net/hp/sample/00105/index2.php

index.php
6行目の var_dump はパラメーターを見たかっただけなので、実際の動作には不要な命令だ。

<?php
main();
exit;

function main(){    // 主制御
  var_dump($_POST);           // パラメーターをダンプして眺めてみる。
  $html_add = '';
  if(isset($_POST['Edit'])){  // [編集]ボタンが押された?
    $id = key($_POST['Edit']);
    $html_add = '<p>[編集]ボタン'.$id.'番が押されました。</p>';
  }
echo <<< EOM
<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="utf-8" />
  <link rel="stylesheet" href="style.css" />
</head>
<body>
  {$html_add}
  <form target="" method="post">
    <input type="submit" name="Edit[1]" value="編集"><br />
    <input type="submit" name="Edit[2]" value="編集"><br />
    <input type="submit" name="Edit[3]" value="編集"><br />
    <input type="submit" name="Edit[4]" value="編集"><br />
    <input type="submit" name="Edit[5]" value="編集">
  </form>
</body>
</html>
EOM;
}

3. 所感

・次回これが必要な場面に遭遇したら、上記の 方法2 を使いたい。


カテゴリー: PHP

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です


日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)