お問い合わせフォームを作ってみた
※ローカルでは全てのエラー確認が出来ましたが、何故かサーバーに上げるとお名前フォームの全角カナの判定がうまく作動してくれません。とりあえず今はその部分の入力チェックは行わないようにしています。
12/16 バグ修正しました。
授業でフォームの練習をしてるのでPHPでお問い合わせ画面を作ってみました。セキュリティーや入力フォームの検査はもっと複雑に出来るんだろうけどとりあえずこの状態でも一通りの機能は出来ていると思います。
お問い合わせフォーム ← 確認ページ
これだけのプログラムでも事前の設計は大事ですね。1つの入力フォームでも値が空の場合の処理だったり指定された入力方法じゃなかった時の処理だったり・・。
意外な所でつまずいた箇所がいろいろあったけど、「textarea」って「value」属性は指定すること出来ないんでしたっけ!?
最初に書いたソースはこれですが
<textarea name="opinion" value="<?php echo htmlspecialchars($_SESSION['join']['opinion'] , ENT_QUOTES , 'UTF-8'); ?>" cols="55" rows="7" > </textarea>
これだと「value」が未定義になってて警告が出てきた。もちろんこのままだと送信しても値が入らないのでこのソースに直しました。
<textarea name="opinion" cols="55" rows="7" > <?php echo htmlspecialchars($_POST['opinion'] , ENT_QUOTES , 'UTF-8'); ?> </textarea>((<del></del>))
「input type」とは取得の仕方が違うんですね。ちょっとハマってしまった...。
入力画面ソース
<?php session_start(); if (!empty($_POST)) { if ($_POST['lastName'] == '') { $error['lastName'] = 'blank'; } if ($_POST['firstName'] == '') { $error['firstName'] = 'blank'; } $str1 = ($_POST['lastNameKana']); $str2= ($_POST['firstNameKana']); mb_regex_encoding("UTF-8"); if ($_POST['lastNameKana'] == '') { $error['lastNameKana'] = 'blank'; } else if (!mb_ereg("^[ア-ケー]+$" , $str1)) { $error['lastNameKana'] = 'kana'; } if ($_POST['firstNameKana'] == '') { $error['firstNameKana'] = 'blank'; } else if (!mb_ereg("^[ア-ケー]+$" , $str2)) { $error['firstNameKana'] = 'kana'; } $tel = mb_convert_kana($_POST['phone'] , 'na' , 'UTF-8'); if ($_POST['phone'] == '') { $error['phone'] = 'blank'; } else if (!preg_match("/^0\d{1,4}-\d{1,4}-\d{4}$/" , $tel)) { $error['phone'] = 'mistake'; } $mail1 = mb_convert_kana($_POST['email1'] , 'a' , 'UTF-8'); $mail2 = mb_convert_kana($_POST['email2'] , 'a' , 'UTF-8'); if ($_POST['email1'] == '') { $error['email1'] = 'blank'; } else if (!preg_match("/^([a-zA-Z0-9])+([a-zA-Z0-9\._-])*@([a-zA-Z0-9_-])+([a-zA-Z0-9\._-]+)+$/", $mail1)) { $error['email1'] = 'mistake'; } if ($_POST['email2'] == '') { $error['email2'] = 'blank'; } else if (!preg_match("/^([a-zA-Z0-9])+([a-zA-Z0-9\._-])*@([a-zA-Z0-9_-])+([a-zA-Z0-9\._-]+)+$/", $mail2)) { $error['email2'] = 'mistake'; } if ($_POST['opinion'] == '') { $error['opinion'] = 'blank'; } else if (strlen($_POST['opinion']) > 3000) { $error['opinion'] = 'length'; } if (empty($error)) { $_SESSION['join'] = $_POST; header('Location: checkForm.php'); exit(); } } if ($_REQUEST['action'] == 'rewrite') { $_POST = $_SESSION['join']; $error['rewrite'] = true; } ?> <!DOCTYPE HTML> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>contact form</title> <link rel="stylesheet" type="text/css" href="contact.css" media="screen, tv"> </head> <body> <div id="container"> <h1>お問い合わせフォーム</h1> <form action="" method="post"> <?php if ($error['lastName'] == 'blank' || $error['firstName'] == 'blank') { echo '<p class="error">※お名前を入力してください</p>'; } if ($error['lastNameKana'] == 'blank' || $error['firstNameKana'] == 'blank') { echo '<p class="error">※お名前(カタカナ 全角)を入力してください</p>'; } else if ($error['lastNameKana'] == 'kana' || $error['firstNameKana'] == 'kana') { echo '<p class="error">※お名前(カタカナ 全角)を全角カナで入力してください</p>'; } if ($error['phone'] == 'blank') { echo '<p class="error">※電話番号を入力してください</p>'; } else if ($error['phone'] == 'mistake') { echo '<p class="error">※電話番号を正しく入力してください</p>'; } if ($error['email1'] == 'blank' || $error['email2'] == 'blank') { echo '<p class="error">※Eメールアドレスを入力してください</p>'; } else if ($mail1 != $mail2) { echo '<p class="error">※Eメールアドレスが一致していません</p>'; } else if ($error['email1'] == 'mistake' || $error['email2'] == 'mistake') { echo '<p class="error">※Eメールアドレスを正しく入力してください</p>'; } if ($error['opinion'] == 'blank') { echo '<p class="error">※お問い合わせ内容を入力してください</p>'; } else if ($error['opinion'] == 'length') { echo '<p class="error">※お問い合わせ内容は1000文字以内でご記入ください</p>'; } ?> <table summary="お問い合わせフォーム"> <tr> <th><label for="zip">郵便番号</label></th> <td><input type="text" name="zip" id="zip" maxlength="8" value="<?php echo htmlspecialchars($_POST['zip'] , ENT_QUOTES , 'UTF-8'); ?>"> <p class="exemplar">※半角英数字でご記入ください</p> </td> </tr> <tr> <th><label for="pref">都道府県</label></th> <td> <select name="pref" id="pref"> <option value="<?php ($_POST['pref']); ?>" selected="selected">選択してください。</option> <?php $prefs = array('北海道','青森県','岩手県','宮城県','秋田県','山形県','福島県','茨城県','栃木県','群馬県','埼玉県','千葉県','東京都', '神奈川県','新潟県','富山県','石川県','福井県','山梨県','長野県','岐阜県','静岡県','愛知県','三重県','滋賀県','京都府','大阪府', '兵庫県','奈良県','和歌山県','鳥取県','島根県','岡山県','広島県','山口県','徳島県','香川県','愛媛県','高知県','静岡県','佐賀県', '長崎県','熊本県','大分県','宮崎県','鹿児島県','沖縄県'); foreach ($prefs as $value) { echo ('<option value="' . $value . '">' . $value . '</option>'); } ?> </select> </td> </tr> <tr> <th><label for="address2">市区郡</label></th> <td><input type="text" name="address2" id="address2" value="<?php echo htmlspecialchars($_POST['address2'] , ENT_QUOTES , 'UTF-8'); ?>" size="50" maxlength="255"> </td> </tr> <tr> <th><label for="address3">町村・番地</label></th> <td><input type="text" name="address3" id="address3" value="<?php echo htmlspecialchars($_POST['address3'] , ENT_QUOTES , 'UTF-8'); ?>" size="50" maxlength="255"> </td> </tr> <tr> <th><label for="address4">マンション・<br />アパート 号室</label></th> <td><input type="text" name="address4" id="address4" value="<?php echo htmlspecialchars($_POST['address4'] , ENT_QUOTES , 'UTF-8'); ?>" size="50" maxlength="255"> </td> </tr> <tr> <th>お名前<p class="indispensable">(※必須)</p></th> <td> <div class="sample1"><label for="lastName">姓</label> <input type="text" name="lastName" id="lastName" value="<?php echo htmlspecialchars($_POST['lastName'] , ENT_QUOTES , 'UTF-8'); ?>" maxlength="10"> <p class="exemplar">(例)池袋</p> </div> <div class="sample2"><label for="firstName">名</label> <input type="text" name="firstName" id="firstName" value="<?php echo htmlspecialchars($_POST['firstName'] , ENT_QUOTES , 'UTF-8'); ?>" maxlength="10"> <p class="exemplar">(例) 太郎</p></div> </td> </tr> <tr> <th>お名前 (カタカナ 全角)<p class="indispensable">(※必須)</p> </th> <td> <div class="sample1"> <label for="lastNameKana">姓</label> <input type="text" name="lastNameKana" id="lastNameKana" value="<?php echo htmlspecialchars($_POST['lastNameKana'] , ENT_QUOTES , 'UTF-8'); ?>" maxlength="10"> <p class="exemplar">(例) イケブクロ</p> </div> <div class="sample2"> <label for="firstNameKana">名</label> <input type="text" name="firstNameKana" id="firstNameKana" value="<?php echo htmlspecialchars($_POST['firstNameKana'] , ENT_QUOTES , 'UTF-8'); ?>" maxlength="10"> <p class="exemplar">(例) タロウ</p> </div> </td> </tr> <tr> <th><label for="phone">電話番号</label><p class="indispensable">(※必須)</p> </th> <td><input type="text" name="phone" id="phone" value="<?php echo htmlspecialchars($_POST['phone'] , ENT_QUOTES , 'UTF-8'); ?>" maxlength="20"> <p class="exemplar">※市外局番から半角数字でご記入ください。 (例) 03-0000-0000</p> </td> </tr> <tr> <th> <label for="email1">ご連絡先Eメールアドレス</label><p class="indispensable">(※必須)</p> </th> <td> <input type="text" name="email1" id="email1" value="<?php echo htmlspecialchars($_POST['email1'] , ENT_QUOTES , 'UTF-8'); ?>" size="50" maxlength="120"> <p class="exemplar">※必ず半角英数字でご記入ください。 (例) ike@bukuro.co.jp</p> <p> </p><p>(確認再入力)</p> <input type="text" name="email2" id="email2" value="<?php echo htmlspecialchars($_POST['email2'] , ENT_QUOTES , 'UTF-8'); ?>" size="50" maxlength="120"> <p class="exemplar">※必ず半角英数字でご記入ください。 (例) ike@bukuro.co.jp</p> <p> </p> </td> </tr> <tr> <th> <label for="opinion">お問い合わせ内容</label><p class="indispensable">(※必須)</p> </th> <td> <textarea name="opinion" cols="55" rows="7"> <?php echo htmlspecialchars($_POST['opinion'] , ENT_QUOTES , 'UTF-8'); ?></textarea> <p class="exemplar">※1000文字以内でご記入ください。</p> <p class="exemplar">※半角カナ、特殊文字は文字化けの原因になるので使用しないでください。</p> </td> </tr> </table> <p class="indispensable">※必須項目は必ず入力ください。入力が抜けていると送信できません。</p> <p><input type="submit" value="確認画面へ"></p> </form> </div> </body> </html>
確認画面ソース
<?php session_start(); if (!isset($_SESSION['join'])) { header('Location: check.php'); exit(); } if (!empty($_POST)) { header('Location: send.php'); } ?> <!DOCTYPE HTML> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>contact form</title> <link rel="stylesheet" type="text/css" href="contact.css" media="screen, tv"> </head> <body> <div id="container"> <form action="" method="post"> <h1>お問い合わせフォーム(確認画面)</h1> <table summary="お問い合わせフォーム"> <tr> <th><label for="zip">郵便番号</label></th> <td><input type="text" name="zip" id="zip" maxlength="8" value="<?php echo htmlspecialchars($_SESSION['join']['zip'] , ENT_QUOTES , 'UTF-8'); ?>"> <p class="exemplar">※半角英数字でご記入ください</p> </td> </tr> <tr> <th><label for="pref">都道府県</label></th> <td> <select name="pref" id="pref"> <option selected="selected"><?php echo ($_SESSION['join']['pref']); ?></option> <?php $prefs = array('北海道','青森県','岩手県','宮城県','秋田県','山形県','福島県','茨城県','栃木県','群馬県','埼玉県','千葉県','東京都', '神奈川県','新潟県','富山県','石川県','福井県','山梨県','長野県','岐阜県','静岡県','愛知県','三重県','滋賀県','京都府','大阪府', '兵庫県','奈良県','和歌山県','鳥取県','島根県','岡山県','広島県','山口県','徳島県','香川県','愛媛県','高知県','静岡県','佐賀県', '長崎県','熊本県','大分県','宮崎県','鹿児島県','沖縄県'); foreach ($prefs as $value) { echo ('<option value="' . $value . '">' . $value . '</option>'); } ?> </select> </td> </tr> <tr> <th><label for="address2">市区郡</label></th> <td><input type="text" name="address2" id="address2" value="<?php echo htmlspecialchars($_SESSION['join']['address2'] , ENT_QUOTES , 'UTF-8'); ?>" size="50" maxlength="255"> </td> </tr> <tr> <th><label for="address3">町村・番地</label></th> <td><input type="text" name="address3" id="address3" value="<?php echo htmlspecialchars($_SESSION['join']['address3'] , ENT_QUOTES , 'UTF-8'); ?>" size="50" maxlength="255" /> </td> </tr> <tr> <th><label for="address4">マンション・<br />アパート 号室</label></th> <td><input type="text" name="address4" id="address4" value="<?php echo htmlspecialchars($_SESSION['join']['address4'] , ENT_QUOTES , 'UTF-8'); ?>" size="50" maxlength="255"> </td> </tr> <tr> <th>お名前<p class="indispensable">(※必須)</p></th> <td> <div class="sample1"><label for="lastName">姓</label> <input type="text" name="lastName" id="lastName" value="<?php echo htmlspecialchars($_SESSION['join']['lastName'] , ENT_QUOTES , 'UTF-8'); ?>" maxlength="10"> <p class="exemplar">(例)池袋</p> </div> <div class="sample2"><label for="firstName">名</label> <input type="text" name="firstName" id="firstName" value="<?php echo htmlspecialchars($_SESSION['join']['firstName'] , ENT_QUOTES , 'UTF-8'); ?>" maxlength="10"> <p class="exemplar">(例) 太郎</p></div> </td> </tr> <tr> <th>お名前 (カタカナ 全角)<p class="indispensable">(※必須)</p> </th> <td> <div class="sample1"> <label for="lastNameKana">姓</label> <input type="text" name="lastNameKana" id="lastNameKana" value="<?php echo htmlspecialchars($_SESSION['join']['lastNameKana'] , ENT_QUOTES , 'UTF-8'); ?>" maxlength="10"> <p class="exemplar">(例) イケブクロ</p> </div> <div class="sample2"> <label for="firstNameKana">名</label> <input type="text" name="firstNameKana" id="firstNameKana" value="<?php echo htmlspecialchars($_SESSION['join']['firstNameKana'] , ENT_QUOTES , 'UTF-8'); ?>" maxlength="10"> <p class="exemplar">(例) タロウ</p> </div> </td> </tr> <tr> <th><label for="phone">電話番号</label><p class="indispensable">(※必須)</p> </th> <td><input type="text" name="phone" id="phone" value="<?php echo htmlspecialchars($_SESSION['join']['phone'] , ENT_QUOTES , 'UTF-8'); ?>" maxlength="20"> <p class="exemplar">※市外局番から半角数字でご記入ください。 (例) 03-0000-0000</p> </td> </tr> <tr> <th> <label for="email1">ご連絡先Eメールアドレス</label><p class="indispensable">(※必須)</p> </th> <td> <input type="text" name="email1" id="email1" value="<?php echo htmlspecialchars($_SESSION['join']['email1'] , ENT_QUOTES , 'UTF-8'); ?>" size="50" maxlength="120"> <p class="exemplar">※必ず半角英数字でご記入ください。 (例) ike@bukuro.co.jp</p> <p> </p><p>(確認再入力)</p> <input type="text" name="email2" id="email2" value="<?php echo htmlspecialchars($_SESSION['join']['email2'] , ENT_QUOTES , 'UTF-8'); ?>" size="50" maxlength="120"> <p class="exemplar">※必ず半角英数字でご記入ください。 (例) ike@bukuro.co.jp</p> <p> </p> </td> </tr> <tr> <th> <label for="opinion">お問い合わせ内容</label><p class="indispensable">(※必須)</p> </th> <td> <textarea name="opinion" cols="55" rows="7" > <?php echo htmlspecialchars($_SESSION['join']['opinion'] , ENT_QUOTES , 'UTF-8'); ?></textarea> <p class="exemplar">※1000文字以内でご記入ください。</p> <p class="exemplar">※半角カナ、特殊文字は文字化けの原因になるので使用しないでください。</p> </td> </tr> </table> <p class="rewrite"><a href ="check.php?action=rewrite">« 書き直しをする</a></p> <p><input type="submit" value="この内容を送信"/></p> </form> </div> </body> </html>