如何在 PHP 联系表的每个不同字段中显示错误消息?
How to show an error message in each of different field for PHP Contact form?
我正在关注 tutorial 并填写了此联系表。它工作正常,但我想在每个字段中显示不同的消息,而不是使用一个框。我试着移动
<?php if($msg != ''): ?>
<div class="alert <?php echo $msgClass; ?>"><?php echo $msg;?></div>
<?php endif; ?>
在输入字段下方,就显示在该位置而言效果很好,但它只是一次显示相同的消息。它不会单独显示不同的消息。我将如何从这里开始?
body {
font-size:10px;
font-family:sans-serif, "Open-sans";
margin:0;
padding:0;
box-sizing:border-box;
letter-spacing:0.1rem;
}
.navbar {
background:#333;
width:100%;
}
.container {
max-width:1100px;
margin:auto;
}
.navbar-header {
display: flex;
flex-flow: row wrap;
justify-content: flex-start;
}
.navbar-brand {
font-size:1.5rem;
padding:1rem;
color:#fff;
text-decoration:none;
}
form {
font-size:1.3rem;
}
.form-group {
display:flex;
flex-direction: column;
margin:1.5rem;
}
label {
color:#333;
margin-bottom:0.7rem;
}
input, textarea {
max-width:100%;
border:0.5px solid darkslategray;
padding:1.3rem;
font-size:1.5rem;
}
button {
background:rgb(67, 130, 211);
color:#fff;
font-size:1.2rem;
padding:1rem;
margin:1.5rem;
border:none;
}
.alert {
margin:1.5rem;
padding:1.5rem;
font-size:1.5rem;
color:#fff;
}
.alert-danger {
background-color:rgb(219, 54, 48);
}
.alert-success {
background-color:rgb(28, 160, 39);
}
<?php
// Message Vars
$msg = '';
$msgClass = '';
// Check for submit
if(filter_has_var(INPUT_POST,'submit')){
// Get Form Data
$name = htmlspecialchars($_POST['name']);
$email = htmlspecialchars($_POST['email']);
$message = htmlspecialchars($_POST['message']);
// Check Required Fields
if(!empty($email) && !empty($name) && !empty($message)){
// Passed
// Check Email
if(filter_var($email, FILTER_VALIDATE_EMAIL) === false ){
// Failed
$msg = 'Please use a valid email';
$msgClass = 'alert-danger';
} else {
// Passed
$toEmail = 'johnDoe@gmail.com';
$subject = 'Contact Request From '.$name;
$body = '<h2>Contact Request</h2>
<h4>Name</h4><p>' .$name. '</p>
<h4>Email</h4><p>' .$email. '</p>
<h4>Message</h4><p>' .$message.'</p>
';
// Email Headers
$headers = "MIME-Version: 1.0" . "\r\n";
$headers .= "Content-Type:text/html;charaset=UTF-8" . "\r\n";
// Additional Headers
$headers .= "From: " .$name. "<".$email.">". "\r\n";
if(mail($toEmail, $subject, $body, $headers)){
// Email Sent
$msg = "Your email has been sent";
$msgClass = 'alert-success';
} else {
// Failed
$msg = "Your email was not sent";
$msgClass = 'alert-danger';
}
}
} else {
// Failed
$msg = 'Please fill in all fields';
$msgClass = 'alert-danger';
}
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>Contact US</title>
</head>
<body>
<nav class="navbar">
<div class="container">
<div class="navbar-header">
<a href="index.php" class="navbar-brand">My Website</a>
</div>
</div>
</nav>
<div class="container">
<?php if($msg != ''): ?>
<div class="alert <?php echo $msgClass; ?>"><?php echo $msg;?></div>
<?php endif; ?>
<form action="<?php echo $_SERVER['PHP_SELF'];?>" method="post">
<div class="form-group">
<label for="name">Name</label>
<input type="text" name="name" class="form-control" value="<?php echo isset($_POST['name']) ? $name : ''; ?>">
</div>
<div class="form-group">
<label for="name">Email</label>
<input type="text" name="email" class="form-control" value="<?php echo isset($_POST['email']) ? $email : ''; ?>">
</div>
<div class="form-group">
<label for="name">Message</label>
<textarea name="message" class="form-control"><?php echo isset($_POST['message']) ? $message : ''; ?></textarea>
</div>
<button type="submit" name="submit" class="btn btn-primary">
Submit</button>
</form>
</div>
</body>
</html>
这是我现在的表格。
我想让它看起来像这个。
您可以将验证警告存储在数组类型变量中,而不是字符串。
例如,这一行:
$msg = 'Please use a valid email';
您也可以这样做:
$msg['email'] = 'Please use a valid email';
此外,我认为您想要验证是否每个必填字段都有自己单独的 if
检查,而不是全部在一起,例如:
if(!empty($email) && !empty($name) && !empty($message)){
您可以实施为:
if (empty($email) || filter_var($email, FILTER_VALIDATE_EMAIL) === false) {
$msg['email'] = 'Please use a valid email';
}
if (empty($name)) {
$msg['name'] = 'Please enter a name';
}
if (empty($message)) {
$msg['message'] = 'Please enter a message';
}
然后在您的 HTML 部分,在每个相关输入字段下方,您可以添加:
<div class="form-group">
<label for="name">Name</label>
<input type="text" name="name" class="form-control" value="<?php echo isset($_POST['name']) ? $name : ''; ?>">
<?php if(isset($msg['name'])): ?>
<p> <?php echo $msg['name']; ?>
<?php endif; ?>
</div>
但是,总的来说,我不得不说这是一种非常老派的使用方式 PHP,您会将逻辑代码与显示代码混合在一起。
掌握了它的窍门后,也许您想研究 Laravel、Symfony 甚至 CodeIgniter 的工作原理,在那里您可以使用所谓的 MVC 将显示与逻辑分开。
同样,您最终可以使用像 Blade 或类似的模板引擎来回显您的变量。
您可以使用 $msg
变量作为数组而不是字符串来保存特定字段的错误。
<?php
$msg = [];
if(filter_has_var(INPUT_POST,'submit')){
//...
// Check Required Fields
if(!empty($email) && !empty($name) && !empty($message)){
if(filter_var($email, FILTER_VALIDATE_EMAIL) === false ){
$msg['email'] = [
'msg' => 'Please use a valid email'
'class' => 'alert-danger'
];
} else {
//...
if(mail($toEmail, $subject, $body, $headers)){
// Email Sent
$msg['default'] = [
'msg' => 'Your email has been sent'
'class' => 'alert-success'
];
} else {
// Failed
$msg['default'] = [
'msg' => 'Your email was not sent'
'class' => 'alert-danger'
];
}
}
} else {
// Failed
$msg['default'] = [
'msg' => 'Please fill in all fields'
'class' => 'alert-danger'
];
}
}
?>
现在在 HTML 中,您可以检查特定错误或消息是否存在并将其显示在正确的位置;顶部的默认消息和电子邮件输入下的电子邮件错误:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>Contact US</title>
</head>
<body>
<nav class="navbar">
<div class="container">
<div class="navbar-header">
<a href="index.php" class="navbar-brand">My Website</a>
</div>
</div>
</nav>
<div class="container">
<!-- HERE -->
<?php if(isset($msg['default'])): ?>
<div class="alert <?php echo $msg['default']['class']; ?>"><?php echo $msg['default']['msg']?></div>
<?php endif; ?>
<form action="<?php echo $_SERVER['PHP_SELF'];?>" method="post">
<!-- ... -->
<div class="form-group">
<label for="name">Email</label>
<input type="text" name="email" class="form-control" value="<?php echo isset($_POST['email']) ? $email : ''; ?>">
<!-- AND HERE -->
<?php if(isset($msg['email'])): ?>
<div class="alert <?php echo $msg['email']['class']; ?>"><?php echo $msg['email']['msg']?></div>
<?php endif; ?>
</div>
<!-- ... -->
</form>
</div>
</body>
</html>
您实际上也可以对您想要的任何其他输入执行相同的操作。
我正在关注 tutorial 并填写了此联系表。它工作正常,但我想在每个字段中显示不同的消息,而不是使用一个框。我试着移动
<?php if($msg != ''): ?>
<div class="alert <?php echo $msgClass; ?>"><?php echo $msg;?></div>
<?php endif; ?>
在输入字段下方,就显示在该位置而言效果很好,但它只是一次显示相同的消息。它不会单独显示不同的消息。我将如何从这里开始?
body {
font-size:10px;
font-family:sans-serif, "Open-sans";
margin:0;
padding:0;
box-sizing:border-box;
letter-spacing:0.1rem;
}
.navbar {
background:#333;
width:100%;
}
.container {
max-width:1100px;
margin:auto;
}
.navbar-header {
display: flex;
flex-flow: row wrap;
justify-content: flex-start;
}
.navbar-brand {
font-size:1.5rem;
padding:1rem;
color:#fff;
text-decoration:none;
}
form {
font-size:1.3rem;
}
.form-group {
display:flex;
flex-direction: column;
margin:1.5rem;
}
label {
color:#333;
margin-bottom:0.7rem;
}
input, textarea {
max-width:100%;
border:0.5px solid darkslategray;
padding:1.3rem;
font-size:1.5rem;
}
button {
background:rgb(67, 130, 211);
color:#fff;
font-size:1.2rem;
padding:1rem;
margin:1.5rem;
border:none;
}
.alert {
margin:1.5rem;
padding:1.5rem;
font-size:1.5rem;
color:#fff;
}
.alert-danger {
background-color:rgb(219, 54, 48);
}
.alert-success {
background-color:rgb(28, 160, 39);
}
<?php
// Message Vars
$msg = '';
$msgClass = '';
// Check for submit
if(filter_has_var(INPUT_POST,'submit')){
// Get Form Data
$name = htmlspecialchars($_POST['name']);
$email = htmlspecialchars($_POST['email']);
$message = htmlspecialchars($_POST['message']);
// Check Required Fields
if(!empty($email) && !empty($name) && !empty($message)){
// Passed
// Check Email
if(filter_var($email, FILTER_VALIDATE_EMAIL) === false ){
// Failed
$msg = 'Please use a valid email';
$msgClass = 'alert-danger';
} else {
// Passed
$toEmail = 'johnDoe@gmail.com';
$subject = 'Contact Request From '.$name;
$body = '<h2>Contact Request</h2>
<h4>Name</h4><p>' .$name. '</p>
<h4>Email</h4><p>' .$email. '</p>
<h4>Message</h4><p>' .$message.'</p>
';
// Email Headers
$headers = "MIME-Version: 1.0" . "\r\n";
$headers .= "Content-Type:text/html;charaset=UTF-8" . "\r\n";
// Additional Headers
$headers .= "From: " .$name. "<".$email.">". "\r\n";
if(mail($toEmail, $subject, $body, $headers)){
// Email Sent
$msg = "Your email has been sent";
$msgClass = 'alert-success';
} else {
// Failed
$msg = "Your email was not sent";
$msgClass = 'alert-danger';
}
}
} else {
// Failed
$msg = 'Please fill in all fields';
$msgClass = 'alert-danger';
}
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>Contact US</title>
</head>
<body>
<nav class="navbar">
<div class="container">
<div class="navbar-header">
<a href="index.php" class="navbar-brand">My Website</a>
</div>
</div>
</nav>
<div class="container">
<?php if($msg != ''): ?>
<div class="alert <?php echo $msgClass; ?>"><?php echo $msg;?></div>
<?php endif; ?>
<form action="<?php echo $_SERVER['PHP_SELF'];?>" method="post">
<div class="form-group">
<label for="name">Name</label>
<input type="text" name="name" class="form-control" value="<?php echo isset($_POST['name']) ? $name : ''; ?>">
</div>
<div class="form-group">
<label for="name">Email</label>
<input type="text" name="email" class="form-control" value="<?php echo isset($_POST['email']) ? $email : ''; ?>">
</div>
<div class="form-group">
<label for="name">Message</label>
<textarea name="message" class="form-control"><?php echo isset($_POST['message']) ? $message : ''; ?></textarea>
</div>
<button type="submit" name="submit" class="btn btn-primary">
Submit</button>
</form>
</div>
</body>
</html>
这是我现在的表格。
我想让它看起来像这个。
您可以将验证警告存储在数组类型变量中,而不是字符串。
例如,这一行:
$msg = 'Please use a valid email';
您也可以这样做:
$msg['email'] = 'Please use a valid email';
此外,我认为您想要验证是否每个必填字段都有自己单独的 if
检查,而不是全部在一起,例如:
if(!empty($email) && !empty($name) && !empty($message)){
您可以实施为:
if (empty($email) || filter_var($email, FILTER_VALIDATE_EMAIL) === false) {
$msg['email'] = 'Please use a valid email';
}
if (empty($name)) {
$msg['name'] = 'Please enter a name';
}
if (empty($message)) {
$msg['message'] = 'Please enter a message';
}
然后在您的 HTML 部分,在每个相关输入字段下方,您可以添加:
<div class="form-group">
<label for="name">Name</label>
<input type="text" name="name" class="form-control" value="<?php echo isset($_POST['name']) ? $name : ''; ?>">
<?php if(isset($msg['name'])): ?>
<p> <?php echo $msg['name']; ?>
<?php endif; ?>
</div>
但是,总的来说,我不得不说这是一种非常老派的使用方式 PHP,您会将逻辑代码与显示代码混合在一起。
掌握了它的窍门后,也许您想研究 Laravel、Symfony 甚至 CodeIgniter 的工作原理,在那里您可以使用所谓的 MVC 将显示与逻辑分开。
同样,您最终可以使用像 Blade 或类似的模板引擎来回显您的变量。
您可以使用 $msg
变量作为数组而不是字符串来保存特定字段的错误。
<?php
$msg = [];
if(filter_has_var(INPUT_POST,'submit')){
//...
// Check Required Fields
if(!empty($email) && !empty($name) && !empty($message)){
if(filter_var($email, FILTER_VALIDATE_EMAIL) === false ){
$msg['email'] = [
'msg' => 'Please use a valid email'
'class' => 'alert-danger'
];
} else {
//...
if(mail($toEmail, $subject, $body, $headers)){
// Email Sent
$msg['default'] = [
'msg' => 'Your email has been sent'
'class' => 'alert-success'
];
} else {
// Failed
$msg['default'] = [
'msg' => 'Your email was not sent'
'class' => 'alert-danger'
];
}
}
} else {
// Failed
$msg['default'] = [
'msg' => 'Please fill in all fields'
'class' => 'alert-danger'
];
}
}
?>
现在在 HTML 中,您可以检查特定错误或消息是否存在并将其显示在正确的位置;顶部的默认消息和电子邮件输入下的电子邮件错误:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>Contact US</title>
</head>
<body>
<nav class="navbar">
<div class="container">
<div class="navbar-header">
<a href="index.php" class="navbar-brand">My Website</a>
</div>
</div>
</nav>
<div class="container">
<!-- HERE -->
<?php if(isset($msg['default'])): ?>
<div class="alert <?php echo $msg['default']['class']; ?>"><?php echo $msg['default']['msg']?></div>
<?php endif; ?>
<form action="<?php echo $_SERVER['PHP_SELF'];?>" method="post">
<!-- ... -->
<div class="form-group">
<label for="name">Email</label>
<input type="text" name="email" class="form-control" value="<?php echo isset($_POST['email']) ? $email : ''; ?>">
<!-- AND HERE -->
<?php if(isset($msg['email'])): ?>
<div class="alert <?php echo $msg['email']['class']; ?>"><?php echo $msg['email']['msg']?></div>
<?php endif; ?>
</div>
<!-- ... -->
</form>
</div>
</body>
</html>
您实际上也可以对您想要的任何其他输入执行相同的操作。