【超初心者向け】お問い合わせフォームの仕組みとは？？

最終更新日：2023-10-11

公開日：2023-10-11

HTML

PHP

お問い合わせフォームの作成依頼をクラウドソーシングなどで目にする機会もあるかと思うのですが、どのようにして動いているかイメージできない方も多いのではないでしょうか。

ということで、今回は超超超簡単にではありますが説明してみたいと思います。

どんなファイルが必要？

今回必要なファイルとしては、下記の2つとなります。

index.php
thanks.php

説明するだけであればこの2つで十分です。

PHPを動かすには環境構築が必要となりますが、ここでは割愛します。
※ちなみに僕はMAMPを使用しています。

index.phpの作成

まずは、index.phpに次のようなコードを書いてみましょう。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
</body>
</html>

まだここではPHPのコードは書いておらず、基本的なHTMLの雛形のみとなります。

bodyタグの中に、次のコードを書きます。

  <form action="" method="POST">

  </form>

上記はformタグの中にお問い合わせの内容を書きますよということを表しています。

action=””と、現在は空欄になっていますが、こちらに送信ボタンをクリックした際に表示したいファイルを指定します。

今回は

action="thanks.php"

と書きます。

また、method=”POST”としている部分ですが、他にもGETなどがあります。
しかし、本題とずれてしまいますのでここでは割愛します。

次に、formタグの中に次のようなコードを書きます。

    <input type="text" name="content" id="">
    <input type="submit" value="送信する">

1つ目のinputタグには、1行のテキストが入力できるフィールドを用意しています。ここで重要なのは、name=”content”と書いている部分です。

このname属性の値は後で重要になるので覚えておきましょう。

2つ目のinputタグにて、typeをsubmitとしていますが、こうすることにより送信ボタンが実装されます。この送信ボタンをクリックすることで、formタグに設定したaction属性のurlに情報を送信しアクセスします。

ここでindex.phpの全容をおさらいしておきます。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <form action="thanks.php">
    <input type="text" name="content" id="">
    <input type="submit" value="送信する">
  </form>
</body>
</html>

thanks.phpに記述する

thanks.phpにも、とりあえずHTMLの雛形を書きます。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
</body>
</html>

上記が書けたら、次はいよいよPHPを書いていきます。

bodyタグの中に、下のように書きます。

<?php echo $_POST['content']; ?>

このコードが何をしているかというと、$_POSTというコードで、index.phpからPOSTメソッドで送信された値を取得するという意味になります。

その後に続けて[‘content’]と書いていますが、こちらは、name属性にcontentとつけたものを取得するという意味になります。

そして、それをechoと書くことで、表示するという意味になります。

全体の意味を書くと

POSTメソッドで受け取った値を表示しますよ

というコードになります。

実際にindex.phpにアクセスして、フォームを送信するとthanks.phpに遷移し、入力した文字列が表示されるかと思います。

ではこのcontent、どこで書いたものかというと、index.php内で

<input type="text" name="content" id="">

と書いたものになります。

なので、例えばこちらのname属性を

<input type="text" name="name" id="">

などにした場合、thanks.phpで書くコードは

<?php echo $_POST['name']; ?>

となるわけですね。

これを、データベースに保存したり、メールの文面として整えて送信などの処理を行うことで、お問い合わせフォームが作成できるというわけです。

今回は以上となります！

\ 初学者向けの指導も行ってます /