*

【PHP】メールフォーム 一度入力した内容が消えてしまう時 POST使って入力内容を保持 ~メールフォームパッケージダウンロードあり~

公開日: : 最終更新日:2013/06/24 how to, ウェブ・ネット・PC(パソコン), サーバ・プログラム

前に、

【PHP】スマホ対応 メールフォーム設置 PEARを使ってgmailのsmtpサーバで送信する(ダウンロード可能)

っちゅう、クソ長ったらしいやつ書きまして。。。

まあこれでメールフォーム(お問い合わせフォーム)はある程度良いのですが一つ問題が。。。

例えばこんな感じでフォーム入力します。


form01

「電話番号は営業の電話とかうっとおしいから入れたくないな」なんて感じで必須項目だったけど入力しなかった場合、

form02

こんな感じでエラーが返されます。

「しょうがねえなあ、入れるか」と戻るボタンを押すと、

form03


叫びの壷 (ツボ つぼ)
なんでじゃーーーーー!


これまでに苦労して入力した内容が消えてしまうってことが起こってしまうのでした。

叫びの壷(叫びの壺)
ドリーム
売り上げランキング: 102,079


これは非常にもったいないです。

せっかく自分のサイトでお問い合わせまでしてくれているのに、


C777_senbeiwotabeteMBA

もういいや、メンドクサイ

ってなったら、超もったいないです。





で、対策を考えなければ!

なんですが、僕みたいに何も考えずにお問い合わせフォーム作っていて、、、

◆入力した内容の間違えに気づいたり
◆エラー(必須項目未入力とか)

で、戻った時にこれまで入力した内容が消える場合と消えない場合があるのですが、これはブラウザに依存する、それすわち

相手(の設定や環境)に依存する

というわけです。




サービスの提供者としては相手側の設定によって挙動が変わったりするのはやっぱり良くないです。

ウェブサイトのブラウザ対応についても

うちのサイトはChromeで見てね。それ以外はぐちゃぐちゃになるから

とかいうサイト嫌ですよね?

まあIE6のシェアは大分低くなってきて、その割に対応するのに労力が半端ないから予算次第では切り捨てるみたいなことはありますけど。。。



この俗に言う「フォーム内容消えちゃう糞ボケ問題」キャッシュのコントロールで制御することが多いです。

何も考えずにフォームを作ると、入力内容確認ページ(このパッケージの場合はConfirm.php)の「戻る」ボタンおよび「内容を修正する」ボタンは以下のソースです。
<INPUT TYPE='BUTTON' VALUE = '戻る' onClick='history.back()' >

この「onClick=’history.back()’」は、ブラウザの戻るボタンと基本的には同じ動きをします。



ここでキャッシュが残っているかはさっき言ったブラウザによるよね?というわけで、すなわち相手次第です。

で、そのキャッシュを残す残さないを制御する方法があり

session_start();
session_regenerate_id(true);

の部分を

session_start();

のみにするとか、いろいろ記事が出てきますが、これでも利かない事象があったりと、僕も詳しくないのでわかりませんが、やっぱり相手の設定や環境・ブラウザに依存しちゃうのかな?

って感じです。





というわけで、今回は前公開したPHPのメールフォームを少し改良して、タイトルの通り、入力した内容を戻ったり修正するまでもphpのpostっていうので、しっかり保持をしよう、というアプローチで作りました。

と、僕があみだしたみたいに言ってるけど、よくやる方法です。





そして、改良したのがこちら。

ご自由にダウンロードして頂いて、自分のサイトに実装してみてね(^^ゞ

button_download_orange








パッケージ内容ですが、

new_kaiso

前回から変わったのが、

◆Confirm.phpを修正
→戻ったり、内容を修正するときも、入力したデータを保持するようにした。

◆index2.phpを追加
→Confirm.phpから保持されたデータを受け取れる用にhtmlじゃなくてphpファイルを用意

てな感じです。



全体のフローとしては、

phpflow


てな感じです。2点、補足として

なんでindex2.phpなんて作ったの?
index.htmlをPHPにすりゃいいじゃん!


もちろんそれでも問題無いですし、むしろそのほうがシンプルでファイルも少なくスッキリしますが。。。

「稼働中のサイトでフォームのところはhtmlで作っちゃってるよ(>_<)」

ってひとは、「お問い合わせはこちら」のリンク先が変わると、かなり面倒くさいよね?

なのでフォームが書いてあるhtmlは生かしで、新たにphpファイルをこさえたです。

というわけなので、index2.phpはindex.htmlとhtml部分は全く同じで、phpが追加されてるだけです。





それはいいけどさぁ、
index2.phpじゃなくてindex.phpのがよくない?
てか「2」ってなに、ダサっ!


これはhtaccessやhttpd.confとかでURLの正規化してたりしている人のためです。

index.htmlやindex.phpとかはURLに表示させないってやつね。

そうするとindex.htmとやindex.php両方混在するとなんか問題起きそうじゃね?ってことでindex2.phpっていう風にしてるです。





で、一応改変した「Confirm.php」と、追加でこさえた「index2.php」のソースもこちらに載せときますね。


Confirm.php

PHP部分のみね。

<?php

//メールアドレスが変じゃないかチェック
//全角だったり@が無かったり
	error_reporting(E_ERROR & ~E_NOTICE & ~E_PARSE);
	function filter($str) {
	$rtn = false;
	if ( ereg("^[^@]+@[^.]+\..+", $str) ) {
		$rtn = true;
	}
	return $rtn;
	}


//特殊文字があったら変換
	$groupzz = htmlspecialchars($_POST["groupzz"]);
	$namesei = htmlspecialchars($_POST["namesei"]);
	$namemei = htmlspecialchars($_POST["namemei"]);
	$mailzz = htmlspecialchars($_POST["mailzz"]);
	$telzz = htmlspecialchars($_POST["telzz"]);
	$numberzz = htmlspecialchars($_POST["numberzz"]);
	$textzz = htmlspecialchars($_POST["textzz"]);
				
//半角カタカナと全角数字を変換
	$groupzz = mb_convert_kana($groupzz,"KVa","Shift_JIS");
	$namesei = mb_convert_kana($namesei,"KVa","Shift_JIS");
	$namemei = mb_convert_kana($namemei,"KVa","Shift_JIS");
	$mailzz = mb_convert_kana($mailzz,"KVa","Shift_JIS");
	$telzz = mb_convert_kana($telzz,"KVa","Shift_JIS");
	$numberzz = mb_convert_kana($numberzz,"KVa","Shift_JIS");
	$textzz = mb_convert_kana($textzz,"KVa","Shift_JIS");

//magic_quotes_gpc=onのときにのみエスケープを解除
	if (get_magic_quotes_gpc()){
		$groupzz = stripslashes($groupzz);
		$namesei = stripslashes($namesei);
		$namemei = stripslashes($namemei);
		$mailzz = stripslashes($mailzz);
		$telzz = stripslashes($telzz);
		$numberzz = stripslashes($numberzz);
		$textzz = stripslashes($textzz);
		}

//必須項目が未入力の時エラー出す
	$f = true;
	if($namesei == null) {
		$f = false;
			print("<br><br>・お名前(姓)が入力されていません。<br> ");
				}

	if ($namemei == null) {
		$f = false;
			print("<br><br>・お名前(名)が入力されていません。<br> ");
				}

	if ($mailzz == null) {
		$f = false;
			print("<br><br>・メールアドレスが入力されていません。<br> ");
				}else if(!filter($mailzz)) {
		$f = false;
			print("<br><br>・メールアドレスが正しく入力されておりません。全角半角をご確認下さい。<br> ");
				}

	if ($telzz == null) {
		$f = false;
			print("<br><br>・電話番号が入力されていません。<br> ");
				}

	if ($numberzz == null) {
		$f = false;
			print("<br><br>・人数が指定されていません。<br> ");
				}

	if($textzz == null) {
		$f = false;
			print("<br><br>・内容が入力されていません。<br> ");
				}

//全部ちゃんと入力されたので、入力内容を表示
	if ($f== true) {
			print("<p>以下の内容でお申込みしてもよろしいでしょうか?</p>
<table class=\"table-01\" border=\"1\" width=\"100%\">
	<tr><th>項目</th><th>入力事項</th></tr>
		<tr><td>団体名</td><td>$groupzz</td></tr>
		<tr><td>お名前</td><td>$namesei$namemei</td></tr>
		<tr><td>メールアドレス</td><td>$mailzz</td></tr>
		<tr><td>電話番号</td><td>$telzz</td></tr>
		<tr><td>人数</td><td>$numberzz</td></tr>
		<tr><td>内容</td><td>$textzz</td></tr>
</table><br><br><br>
				");
					
//入力されたものをSend.phpもしくは修正用のindex2.phpに入れる
print ("<form  method='post' action='Send.php'>
		<INPUT TYPE='HIDDEN' NAME='groupzz' VALUE='$groupzz'>
		<INPUT TYPE='HIDDEN' NAME='namesei' VALUE='$namesei'>
		<INPUT TYPE='HIDDEN' NAME='namemei' VALUE='$namemei'>
		<INPUT TYPE='HIDDEN' NAME='mailzz' VALUE='$mailzz'>
		<INPUT TYPE='HIDDEN' NAME='telzz' VALUE='$telzz'>
		<INPUT TYPE='HIDDEN' NAME='numberzz' VALUE='$numberzz'>
		<INPUT TYPE='HIDDEN' NAME='textzz' VALUE='$textzz'>
		<INPUT TYPE='SUBMIT' VALUE='この内容で送信する'><br>
		</form>
		<br><br>

		
		<form  method='post' action='index2.php'>
		<INPUT TYPE='HIDDEN' NAME='groupzz' VALUE='$groupzz'>
		<INPUT TYPE='HIDDEN' NAME='namesei' VALUE='$namesei'>
		<INPUT TYPE='HIDDEN' NAME='namemei' VALUE='$namemei'>
		<INPUT TYPE='HIDDEN' NAME='mailzz' VALUE='$mailzz'>
		<INPUT TYPE='HIDDEN' NAME='telzz' VALUE='$telzz'>
		<INPUT TYPE='HIDDEN' NAME='numberzz' VALUE='$numberzz'>
		<INPUT TYPE='HIDDEN' NAME='textzz' VALUE='$textzz'>
		<center><INPUT TYPE='SUBMIT' VALUE='内容を修正する' ></center>
		</form>
					
		");

}else{

//エラーで戻る場合も修正用のindex2.phpに入れる
print  ("<br><br><br>
		<form  method='post' action='index2.php'>
		<INPUT TYPE='HIDDEN' NAME='groupzz' VALUE='$groupzz'>
		<INPUT TYPE='HIDDEN' NAME='namesei' VALUE='$namesei'>
		<INPUT TYPE='HIDDEN' NAME='namemei' VALUE='$namemei'>
		<INPUT TYPE='HIDDEN' NAME='mailzz' VALUE='$mailzz'>
		<INPUT TYPE='HIDDEN' NAME='telzz' VALUE='$telzz'>
		<INPUT TYPE='HIDDEN' NAME='numberzz' VALUE='$numberzz'>
		<INPUT TYPE='HIDDEN' NAME='textzz' VALUE='$textzz'>
		<center><INPUT TYPE='SUBMIT' VALUE='戻る' ></center>
		</form>
					");
			}

	
?>


ポイントは最後のフォームを「送信する」「戻って修正する」のところで、改良前は

<INPUT TYPE='BUTTON' VALUE = '戻る' onClick='history.back()' >

のところが

<form  method='post' action='index2.php'>
・
・
(中略)
・
・
<center><INPUT TYPE='SUBMIT' VALUE='戻る' ></center>
って言う風にhistory.backじゃなくてpostのSUBMIT使って、情報を受渡してるところですね!



続いて

index2.php

これは一応全部ね。htmlとphp混在してるから。
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
<title>フォーム入力画面</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
<link rel="stylesheet" href="css/style.css" />
</head>

<body>
<h1>フォーム入力画面</h1>

<?php

//値を最初にクリアしとく
$groupzz = '';
$namesei = '';
$namemei = '';
$mailzz = '';
$telzz = '';
$numberzz = '';
$textzz = '';

//各項目前ページから内容があれば入れる
if ($_POST) {
    $groupzz = $_POST["groupzz"];
}
if ($_POST) {
    $namesei = $_POST["namesei"];
}
if ($_POST) {
    $namemei = $_POST["namemei"];
}
if ($_POST) {
    $mailzz = $_POST["mailzz"];
}
if ($_POST) {
    $telzz = $_POST["telzz"];
}
if ($_POST) {
    $numberzz = $_POST["numberzz"];
}
if ($_POST) {
    $textzz = $_POST["textzz"];
}
	
?>

<form name="form1" method="post" action="Confirm.php">
<p><font color="#ff0000">*</font>は必須項目です</p>
▼団体名(任意)<br>
<input name="groupzz" type="text" value="<?= htmlspecialchars($groupzz, ENT_QUOTES, 'Shift_JIS'); ?>">
▼お名前<font color="#ff0000">*</font><br>
姓
<input type="text" name="namesei" value="<?= htmlspecialchars($namesei, ENT_QUOTES, 'Shift_JIS'); ?>">
<br>名
<input type="text" name="namemei" value="<?= htmlspecialchars($namemei, ENT_QUOTES, 'Shift_JIS'); ?>">
▼メールアドレス<font color="#ff0000">*</font><br>
<input type="text" name="mailzz" value="<?= htmlspecialchars($mailzz, ENT_QUOTES, 'Shift_JIS'); ?>">
▼電話番号<font color="#ff0000">*</font><br>
<input type="text" name="telzz" value="<?= htmlspecialchars($telzz, ENT_QUOTES, 'Shift_JIS'); ?>">
▼人数<font color="#ff0000">*</font><br>
<select name="numberzz">
<option value="">---</option>
<option value="1名">1名</option>
<option value="2名">2名</option>
<option value="3名">3名</option>
<option value="4名">4名</option>
<option value="5名">5名</option>
</select>
▼内容<font color="#ff0000">*</font><br>
<textarea name="textzz" ><?= htmlspecialchars($textzz, ENT_QUOTES, 'Shift_JIS'); ?>"</textarea>
<p>
<input type="submit" value="確認画面に進む">
</p>
</form>
</body>
</html>



こっちのポイントはフォームの中でvalueの中に受け取ったこれまでに入力された内容を入れてるところです。
<input name="groupzz" type="text" value="<?= htmlspecialchars($groupzz, ENT_QUOTES, 'Shift_JIS'); ?>">

これによって、自分で入力したデータがフォームの中に入るよね!ってことです。

めでたしめでたし!!






即戦力になるための PHPシステム開発の教科書
マッキーソフト株式会社
技術評論社
売り上げランキング: 68,078


PHPによるWebアプリケーションスーパーサンプル 第2版
西沢 直木
ソフトバンククリエイティブ
売り上げランキング: 16,761


関連記事

【結婚式二次会のゲームなどにおすすめ】めくりフリップ 自作 手作り 作り方 材料 で検索にひっかかれ!!

先日友達の結婚式の二次会の幹事をやりました。 その中でゲームの中でめくりフリップあった方がいい

記事を読む

【PHP】曜日と時間を検出して、いつまでに対応するかを表示する

営業時間中であれば、お問合わせいただいてから何分以内に対応しますよという文句を自動で表示したい。

記事を読む

【CentOS,vsftp,Linux(UNIX)】FTPユーザーアカウントの作成とディレクトリのアクセス制限覚書

外注先にサイトの作成やシステムの構築などを依頼する場合に、特定のディレクトリ(フォルダ)以外にアクセ

記事を読む

iPhone5水没 エクスプレス交換サービスで秒速で4,400円(税込)で新品に変わる~AppleCareにより~

今日も元気だ!お酒が旨い。 というわけで尿路結石の激痛で死にかけたのはどこ吹く風と暴飲暴食をし

記事を読む

【PHP,WordPress,Contactform7】ユーザーエージェント(UA)から「デバイス(PC,スマホ,タブレット)」「OS」「ブラウザ」を取得する→これをContactform7に実装

ユーザーエージェント(UA)から「デバイス(PC,スマホ,タブレット)」「OS」「ブラウザ」

記事を読む

起業するときにおすすめのサービス【PCFAXでペーパーレス】 02

前回のやつ 前回の流れから、ミニマムに商売をはじめるためのおすすめのサービスの紹介です。

記事を読む

【WordPress】Contact Form 7でEnterキーを押すと勝手に送信されてしまう問題を解決する魔法のコード(JavaScript)

アイキャッチ画像はギャグとして(笑) 就職活動中の女子大生にJavaとJavaScri

記事を読む

起業するときにおすすめのサービス【格安フリーダイヤル】 01

具体案が欲しい時ってありますよね。たまたまはてブで遊んでいるときにこんな記事を発見。 誰にでも

記事を読む

愛車 エブリー

20年戦士のオンボロ愛車をパワーアップ(スズキ・エブリーにNARDI取り付け)

少し前にカーステを取り替えた愛車の青春カー! ※青春カーの命名はN君です。

記事を読む

注文住宅(マイホーム)を建てる 凄い工務店発見 キミドリ建築の謎

貧乏人も夢を見てもいいじゃない、というわけで。 前回3回に分けて工務店の探し方としてスーモカウ

記事を読む

Comment

  1. 伊藤広樹 より:

    参考にさせていただきました!
    ありがとうございます!

    function h($s)
    {
    return htmlspecialchars($s, ENT_QUOTES, “UTF-8”);
    }

    関数を一度設定すると、何度も長いコードを書かなくて(ペースト)する必要がなくなると思います!

    お互いがんばりましょう!

Message

メールアドレスが公開されることはありません。

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

  • 高橋拓郎(32歳)
    愛知県知多市生まれ。
    大学在学中に個人で始めた事業を、大学院中退後法人化(法人化のために中退が正しいかも)。
    簡単にコンタクトとれるのでt@takuro.infoまで何か御用があればなんなりと。
    ブログの感想やご意見も大歓迎です!
【javaScript】2017年版 法人税実効税率 自動計算機(コードも置いとくね)

今日は4/3だからこれは嘘じゃないよ!! 法人税実効税率

【ユーザー車検】軽トラを無料でGETしたけど車検代が無いから初の軽自動車ユーザー車検に挑戦!

青春カーと悲しい別れ どうも。貧乏が板に付いてきて久しい僕で

【LINEbot】LINEbotが作れるからphpで作ってみたの巻 ~さくらの共有SSLでも動くよ~

BOT API Trial Accountってのが、公開されたので、L

【電気自動車】日産リーフの無料モニターに当選して2週間使ってみたけれども。。。結論的に購入は時期尚早??

どうも。実写版とってもラッキーマンこと僕です! とっても!ラッキ

追尾メニューのAdSense削除の件

このサイトへのお問い合わせで、以下のような内容のご指摘を頂きました。

→もっと見る

PAGE TOP ↑