2021年2月9日 / 最終更新日時 : 2021年2月16日 haruto PHP

【PHP】ページ遷移が伴うフォームの実装

ぜひ読んでほしい方

・サンクスページのように、遷移が伴うようなフォームにする必要がある。
・質問ページが複数にわたるようなフォームを作成したい。

全コード公開

↓↓index.php

<?php

require_once 'const.php'; //設定ファイル
require_once 'functions.php';

session_start();

$page = 1;

if(isset($_POST['submit_1'])){

    //POST送信内容をSESSION配列に格納
    $_SESSION['family_name'] = $_POST['family_name']; 
    $_SESSION['first_name'] = $_POST['first_name'];
    $_SESSION['family_name_kana'] = $_POST['family_name_kana'];
    $_SESSION['first_name_kana'] = $_POST['first_name_kana'];

    $page = 2; //2ページ目に遷移

}elseif(isset($_POST['submit_2'])){

    //SESSION送りしたデータを変数に格納
    $family_name = $_SESSION['family_name'];
    $first_name = $_SESSION['first_name'];
    $family_name_kana = $_SESSION['family_name_kana'];
    $first_name_kana = $_SESSION['first_name_kana'];
    $email = $_POST['email'];

    $link = getDbConnect(); //DBに接続
    insertUserInfo($link, $family_name, $first_name, $family_name_kana, $first_name_kana, $email); //DBにデータを保存
    closeDbConnect($link); //DB切断
}

include_once 'form.php';

<?php

require_once 'const.php'; //設定ファイル

require_once 'functions.php';

session_start();

$page = 1;

if(isset($_POST['submit_1'])){

//POST送信内容をSESSION配列に格納

$_SESSION['family_name'] = $_POST['family_name'];

$_SESSION['first_name'] = $_POST['first_name'];

$_SESSION['family_name_kana'] = $_POST['family_name_kana'];

$_SESSION['first_name_kana'] = $_POST['first_name_kana'];

$page = 2; //2ページ目に遷移

}elseif(isset($_POST['submit_2'])){

//SESSION送りしたデータを変数に格納

$family_name = $_SESSION['family_name'];

$first_name = $_SESSION['first_name'];

$family_name_kana = $_SESSION['family_name_kana'];

$first_name_kana = $_SESSION['first_name_kana'];

$email = $_POST['email'];

$link = getDbConnect(); //DBに接続

insertUserInfo($link, $family_name, $first_name, $family_name_kana, $first_name_kana, $email); //DBにデータを保存

closeDbConnect($link); //DB切断

}

include_once 'form.php';

↓form.php

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <form method="post" action="index.php">

<?php if($page == 1){ ?>
        姓：<input type="text" name="family_name">
        名：<input type="text" name="first_name">
        姓（フリガナ）<input type="text" name="family_name_kana">
        名（フリガナ）<input type="text" name="first_name_kana">
        <button type="submit" name="submit_1">次のページへ</button>

<?php }elseif($page == 2){ ?>
        メールアドレス:<input type="email" name="email">
        <button type="submit" name="submit_2">送信</button>
<?php } ?>

    </form>
</body>
</html>

<!DOCTYPE html>

<head>

<title>Document</title>

</head>

<body>

<?php if($page == 1){ ?>

姓：<input type="text" name="family_name">

名：<input type="text" name="first_name">

姓（フリガナ）<input type="text" name="family_name_kana">

名（フリガナ）<input type="text" name="first_name_kana">

<button type="submit" name="submit_1">次のページへ</button>

<?php }elseif($page == 2){ ?>

メールアドレス:<input type="email" name="email">

<?php } ?>

</form>

</body>

</html>

functions.php

<?php

function getDbConnect(){
    if(!$link = mysqli_connect(DB_HOST , DB_USER , DB_PASSWD , DB_NAME)){
        die('error: '. mysqli_connect_error());
    }
    mysqli_set_charset($link , DB_SPECIALCHARS_SET);
    return $link;
}

function closeDbConnect($link){
    mysqli_close($link);
}

function checkDb($link , $sql){
    if(mysqli_query($link , $sql) === TRUE){
        return TRUE;
    }else{
        return FALSE;
    }
}

function insertUserInfo($link, $family_name, $first_name, $family_name_kana,  $first_name_kana, $email){
    $sql = "INSERT INTO user_info (family_name, first_name, family_name_kana, first_name_kana, email) VALUES ('$family_name', '$first_name', '$family_name_kana', '$first_name_kana', '$email')"; //カラム名に応じて適宜変更
    return checkDb($link, $sql);
}

<?php

function getDbConnect(){

if(!$link = mysqli_connect(DB_HOST , DB_USER , DB_PASSWD , DB_NAME)){

die('error: '. mysqli_connect_error());

}

mysqli_set_charset($link , DB_SPECIALCHARS_SET);

return $link;

}

function closeDbConnect($link){

mysqli_close($link);

}

function checkDb($link , $sql){

if(mysqli_query($link , $sql) === TRUE){

return TRUE;

}else{

return FALSE;

}

function insertUserInfo($link, $family_name, $first_name, $family_name_kana, $first_name_kana, $email){

$sql = "INSERT INTO user_info (family_name, first_name, family_name_kana, first_name_kana, email) VALUES ('$family_name', '$first_name', '$family_name_kana', '$first_name_kana', '$email')"; //カラム名に応じて適宜変更

return checkDb($link, $sql);

}

const.php

<?php
//DBの設定ファイル

define('DB_HOST' , 'ローカルホスト名');
define('DB_USER' , 'ユーザー名');
define('DB_PASSWD' , 'パスワード');
define('DB_NAME' , 'データベース名');

define('HTML_SPECIALCHARS_SET','UTF-8');
define('DB_SPECIALCHARS_SET','utf8');

<?php

//DBの設定ファイル

define('DB_HOST' , 'ローカルホスト名');

define('DB_USER' , 'ユーザー名');

define('DB_PASSWD' , 'パスワード');

define('DB_NAME' , 'データベース名');

define('HTML_SPECIALCHARS_SET','UTF-8');

define('DB_SPECIALCHARS_SET','utf8');

セッションを利用して実装

　index.phpの6行目にsession_start(); とある通り、セッションを利用することで複数ページにわたるフォームを作ることができます。

form.phpの解説

　今回のコードでは、form.phpファイルに2ページ両方とものコードを書いています。1ページ目のコードはif($page == 1)からの部分、2ページ目のコードは、elseif($page == 2)からの部分となっています。3ページ以上のフォームにしたい場合も同様に増やしていけばよいことになります。

index.phpの解説

　10行目のif($_POST[‘submit_1’])の部分は、「もし1ページ目の送信だったら」ということになります（form.phpの17行目参照）。同様に、($_POST[‘submit_2’])の部分は、「もし2ページ目の送信だったら」ということになります(form.phpの21行目参照)。

　1ページ目の送信時に、13~16行目で＄_POST[]の値を、変数ではなく$_SESSION[]に格納しています。こうすることで、ページ遷移時のリロード後も格納した値を保持し続けることができます。

カテゴリー: PHP

タグ: フォーム作成

【PHP】ページ遷移が伴うフォームの実装

ぜひ読んでほしい方

全コード公開

セッションを利用して実装

form.phpの解説

index.phpの解説

WordPressでウィジェットエリアを増やす方法

【PHP】 Twitter bot 作り方（前編）～スクリプトの作成～