トップへ戻る
BLOGS

PHP 自作コンタクトフォームでセレクトボックスを作る

PHP 自作コンタクトフォームでセレクトボックスを作る

はい

ということこで前回まで作成していた本サイトのお問合せフォームに

カスタムをどんどん追加してリッチなフォームにしていきたいと思います

今回は

問い合わせの件名をセレクトボックスにする

ってなわけで要件の部分でドロップダウンの選択肢の中から

  • ご質問
  • ご相談
  • ご意見
  • お見積り
  • 資料請求

等の件名を選んでいただく形式を作成します

ではHTMLを書いていきます、

      <select name="mkind" id="select">
        <option value="1">ご質問</option>
        <option value="2">ご相談</option>
        <option value="3">ご意見</option>
        <option value="4">資料請求</option>
        <option value="5">お見積り</option>
      </select>

さてそれでユーザーがドロップダウンを選択して値をまた変数に入れるわけですがoption value=”1″の「1」が値として渡るだけでこちらを

サーバー側からページを返す際にもとの「ご質問」に変換しなければいけません。

そこでせっかくPHPで記述しているのでこの場合は、

optionの値の配列を作ってforeachで回そう

ということで値が全て入った配列変数を定義しておき

キーと値をまとめてforeachで出力します

もちろんループなのでforでもwhileでも問題ありません。

$kind = array(
  '1' => 'ご質問',
  '2' => 'ご相談',
  '3' => 'ご意見',
  '4' => '資料請求',
  '5' => 'お見積り'
);

最上部で配列を定義出来たら入力画面から書いていきます。

<div class="form_group">
 <label for="select">ご用件の種別</label>
 <select name="mkind" id="select">
  <option value="" selected="selected">要件を選択して下さい</option>
  <?php foreach ($kind as $key => $title) {
  if ($_SESSION['mkind'] == $key ) { ?>
   <option value="<?php echo $key; ?>" selected="selected"><?php echo $title; ?></option>
  <?php } else { ?>
 <option value="<?php echo $key; ?>"><?php echo $title; ?></option>
          <?php }
        }?>
        </select><br>
      </div>

まず最初のselected属性はvalueをからにして選択出来ないようにしておきます。

この属性を付けることで最初の入力画面に来た際にUIをわかりやすくしています。

if ($_SESSION[‘mkind’] == $key )は戻るボタンを押された際の値を維持するための分岐です

入力された値を持って次のconfirmへ遷移した場合$_SESSION[‘mkind’]としてその値を保存しておくようにするので

入力された値があってそれと等しいoptionのvalueを持つタグに

selected属性をつけて選択した状態を作ります。

では送信された処理です、

else if ( isset($_POST['confirm']) && $_POST['confirm'] ) {
  if (!$_POST['mkind']) {
    $err_msg[] = "種別を選択してください。";
  } else if ( $_POST['mkind'] <= 0 || $_POST['mkind'] >= 5) {
    $err_msg[] = "種別が不正です。";
  }
$_SESSION['mkind'] = htmlspecialchars($_POST['mkind'], ENT_QUOTES, "UTF-8");

フォームを入力し、送信された値をconfirmとして判定し条件分岐で

バリデーションをします。

まず(!$_POST[‘mkind’])が存在するかどうか、そして、

$_POST[‘mkind’] <= 0 || $_POST[‘mkind’] >= 5)こちらは中の値が0以下ではないか、または5以上では無いか、の確認をしています。

悪意のあるプログラマーにどのような攻撃をされるか分からないのでこうゆう部分もしっかりとセキュリティ対策しておきます。

エラーチェックが済んだらhtmlspecialcharsでサニタイズした値をセッション変数に代入してここは完了です

次は確認画面と送信内容の出力方法です、

//確認画面
<p><?php echo $kind[$_SESSION['mkind']]; ?></p>
//送信内容
$message = "お問い合わせを受け付けました。\r\n"
    ."要件の種別:".$kind[$_SESSION['mkind']]."\r\n"

セッション変数には数字の値しか入っていないので定義した配列の

「〜〜番目」という形で出力できます。

今回はこんな感じで追加要素を入れました

他にもリッチなフォームにするためにカスタムできる部分はありそうですね

コメントをお待ちしております

お気軽にコメントをどうぞ。

CAPTCHA