付属の写真のようにエラーが出るようにしたいです。提示したコードだけでは、エラーメッセージ文字が上の

解決済

質問者：pjdmgam
質問日時：2021/11/23 08:27
回答数：1件

付属の写真のようにエラーが出るようにしたいです。
提示したコードだけでは、エラーメッセージ文字が上の方に出てくるだけで、四角い図形も出てきません。
javascriptでエラーメッセージを出せれば、写真のようなになると思います。

そこでなのですが、
PHPのコードはそのまま崩さずjavascriptでも同じエラーメッセージ出すコードが書けません。どうコードを書いたら
よいでしょうか？
nameとquestionの２つフォームとがあります。

回答よろしくお願いいたします。

<?php
session_start();

$errors = array();

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

$plan = $_POST['plan'];

$name = $_POST['name'];
$question = $_POST['question'];

if($name === "") { $errors['name'] ="名前が入力されていません。 ";
}

if($question === "") { $errors['question'] ="お問い合わせ内容入力（150文字以内）が入力されていません。 ";
}

if(count($errors) ===
$_SESSION['name'] = $name;
$_SESSION['question'] = $question;

/* 確認画面の表示， */
header('Location:http://▼▼php');
exit();
}
}

if(isset($_GET['action']) && $_GET['action'] === 'edit'){

$name = $_SESSION['name'];
$question = $_SESSION['question'];
}
?>

<!DOCTYPE html>
<html lang="ja">
<head>
<meta content="text/html; charset=utf-8" />
<title>お問い合わせ画面</title>
<style type="text/css">
/* 入力フォームの位置 */

.auto-style1 {

text-align: center;

}

</style>

<?php echo "<ul>";foreach($errors as $value) {

echo "<li>";
echo $value;
echo "</li>";
}

echo "</ul>";

?>

</head>

<body>

<form action="companyhp6form1.php" method="post">

<div class="auto-style1">

<p class="tel-titile">
名前：※
</p>
<input type="text" class="name" name="name" id="name" value="<?php if(isset($name)){ echo $name; } ?>" />
</div>

<div class="auto-style1">
<p class="tel-titile">
お問い合わせ内容入力（150文字）：
</p>
<textarea name="question" class="question" id="question" cols="40" rows="10" placeholder="150文字以内で入力して下さい。"></textarea>

</div>

<div class="auto-style1">

<button type="submit" id="submit" name="submit" class="auto-style4">
送信</button>
</div>

</form>

</body>
<script src="main.js"></script>

</html>

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (1件)

ベストアンサー優先
最新から表示
回答順に表示

参考程度に

No.1ベストアンサー

回答者： fujillin
回答日時：2021/11/23 13:58

こんにちは

入力の有無のチェックを行いたいようですが、ご提示の内容はチェックの対象となる内容ではないですよね？
肝心の情報が欠如しているので、どのようにチェックするのかは回答しようがありませんね。

＞PHPのコードはそのまま崩さず～～
PHPはよく知りませんけれど、
＞if(count($errors) ===
って、どうみても尻切れトンボだし、head内に開始タグのないリストを出力してみたりと、ハチャメチャな気がしますけれど・・・

元のHTMLがどうになっているのかまったくわかりませんけれど、「入力の有無」のチェック程度であれば、最近のブラウザならスクリプトなどを使わなくても促せるUIにすることは可能です。

以下、ご参考にでもなれば。

<form action="#" method="post" style="display:inline-flex;flex-direction:column;">
<label>名　前　：
<input name="name" type="text" placeholder="お名前の入力" required />
</label>
<label>ふりがな：
<input name="kana" type="text" placeholder="ふりがなの入力" required />
</label>
<label>電話番号：
<input name="phone" type="tel" placeholder="電話番号の入力"
pattern="[0-9]{3}-[0-9]{3}-[0-9]{4}" required />
</label>
<label>メールアドレス：
<input name="mail" type="email" placeholder="メールアドレスの入力" required />
</label>
<label>年　代　：
<select name="age" required>
<option value="">--年代を選択--</option>
<option value="20代">20代</option>
<option value="30代">30代</option>
<option value="40代">40代</option>
</select>
</label>
<p><input name="submit" type="submit" value="送信" /></p>
</form>

※ どうしてもスクリプトを使いたいのであれば、submit時のイベント処理で、各値の存在をチェックしてメッセージを表示するなり、スクリプトからsubmitをするようにすれば良いでしょう。