我有一个简单的登录屏幕,它是一个粘性表单。我正在尝试使表单提交但输入字段为空时,登录框变为红色。我遇到了一些非常奇怪的行为,其中两个字段正确地执行了该操作,而其他字段似乎是随机的。下面左侧的照片显示了页面加载并提交后发生的情况。右边的第二张照片显示了我输入一些详细信息后的“随机”行为-单击提交,然后返回并删除这些详细信息,然后再次重新提交。所有数据都存储在php全局变量中,即目前不存储在数据库中。
<!doctype html>
<html>
<head>
<title>Sign Up Report</title>
<meta charset= "utf-8">
<link type="text/css" rel="stylesheet" href="login.css">
</head>
<body>
<?php
$firstName = $_POST['firstName'];
$lastName = $_POST['lastName'];
$address = $_POST['address'];
$city = $_POST['city'];
$zip = $_POST['zip'];
$email = $_POST['email'];
$telephone = $_POST['telephone'];
$presentForm = false;
$user = $_POST['user'];
$level = implode(", ",$_POST['level']);
$subjects = implode(", ",$_POST['subject']);
$required="";
$userError = "" ;
$levelError = "" ;
$subjectsError = "" ;
$errorMessage="";
//check to see if the form has been submitted and that all the required data is present if so then report success to user
if(isset($_POST['submit']))
{
if (((!empty($firstName))) && ((!empty($lastName))) && ((!empty($address))) && ((!empty($city))) && ((!empty($email))) && ((!empty($telephone))) && ((!empty($zip))) && ((!empty($level))) && ((!empty($subjects))))
{
echo '<style> h1 {text-decoration: none; margin-left:20px;} #confirmation { background-color: white; border: solid black 2px; margin: 15px; background-image: url("../Images/tutorTeam.png") } p {color:blue; margin-left: 10; padding:10px; } li { margin-left: 15px; } img { padding: 20px;}</style>';
echo '<h1>Thank you ' . $firstName . ' for signing up!</h1>';
echo '<div id="confirmation">';
echo '<p>Please review the following details to ensure they are correct: </p>';
echo '<li>You are a <b>' . $user . '</b></li><br>';
echo '<li>Your address is <b>' . $address . $city . $zip .'</b></li><br>';
echo '<li>Your contact number is <b>' . $telephone . '</b></li><br>';
echo '<li>Your email is <b>' . $email . '</b></li><br>';
echo '<li>The subject(s) you selected- <b>' . $subjects . '</b></li><br>';
echo '<li>Your tuition level(s) <b>' . $level . '</b></li>';
echo '<a href="../index.html"><img src="../Images/confirm.png" id="return"></a>';
echo '<a href="tutorSignUp.php"><img src="../Images/edit.png" id="return"></a>';
echo '</div>';
$presentForm = false;
}else{
$presentForm=true;
$required = "req";
$levelError = "level selection required" ;
$subjectsError = "subject selection required" ;
$errorMessage="Please enter the data that is missing to sign up";
}
}
if(!isset($_POST['submit']))
{
$presentForm=true;
}
if($presentForm)
{
?>
<div id="container">
<section id="top">
<a href="../index.html">
<img id="back" src="../images/back.png" height="40px">
</a>
<img id="logo" src="../images/tutorTeamLogo.png" height="40px">
</section>
<section id="main">
<p><span class="error"><?php echo $errorMessage?></span> </p>
<p>Are you a tutor or customer? </p>
<form method="POST" action=" <?php echo $_SERVER['PHP_SELF']; ?>" >
<select name="user">
<option value="Customer">Customer</option>
<option value="Tutor">Tutor</option>
</select>
<p>Please complete to sign up.</p>
<section id="details">
<div class="tablerow">
<p>First name:</p>
<p><input class="inputBox <?php if(empty($firstName) && (isset($_POST['submit']))) echo 'errorBox' ?> " type="text" name="firstName" value="<?php echo $firstName; ?>" ></p>
<span class="error">* <?php echo $required;?></span>
</div>
<div class="tablerow">
<p>Last name:</p>
<p><input class="inputBox <?php if(empty($lastName) && (isset($_POST['submit']))) echo 'errorBox' ?> " type="text" name="lastName" value="<?php echo $lastName; ?> "></p>
<span class="error">* <?php echo $required;?></span>
</div>
<div class="tablerow">
<p>Address:</p>
<p><input class="inputBox <?php if(empty($address) && (isset($_POST['submit']))) echo 'errorBox' ?> " type="text" name="address" value="<?php echo $address; ?> "></p>
<span class="error">* <?php echo $required;?></span>
</div>
<div class="tablerow">
<p>city: </p>
<p><input class="inputBox <?php if(empty($city) && (isset($_POST['submit']))) echo 'errorBox' ?> " type="text" name="city" value="<?php echo $city; ?> "></p>
<span class="error">* <?php echo $required; ?></span>
</div>
<div class="tablerow">
<p>Zip: </p>
<p> <input class="inputBox <?php if(empty($zip) && (isset($_POST['submit']))) echo 'errorBox' ?> " type="text" name="zip" value="<?php echo $zip; ?> "></p>
<span class="error">* <?php echo $required; ?></span>
</div>
<div class="tablerow">
<p>Telephone:</p>
<p><input class="inputBox <?php if(empty($telephone) && (isset($_POST['submit']))) echo 'errorBox' ?> " type="tel" name="telephone" value="<?php echo $telephone; ?> "></p>
<span class="error">* <?php echo $required; ?></span>
</div>
<div class="tablerow">
<p>Email:</p>
<p><input class="inputBox <?php if(empty($email) && (isset($_POST['submit']))) echo 'errorBox' ?> " type="text" name="email" value="<?php echo $email; ?>"></p>
<span class="error">* <?php echo $required; ?></span>
</div>
</section>
<img src="../Images/dubaiZones.png" id="dubaiMap">
<p>Tutoring level <span class="error">* <?php echo $levelError;?> </span> </p>
<input type="checkbox" name="level[]" value="Nursery" >Nursery<br>
<input type="checkbox" name="level[]" value="Primary" >Primary<br>
<input type="checkbox" name="level[]" value="Secondary" >Secondary<br>
<input type="checkbox" name="level[]" value="ALevel" >College/A Level <br>
<input type="checkbox" name="level[]" value="Undergraduate" >Undergraduate<br>
<input type="checkbox" name="level[]" value="Postgraduate" >Postgraduate<br>
<p> Subject specialism(s)<span class="error">* <?php echo $subjectsError;?></span></p>
<input type="checkbox" name ="subject[]" value="English">English<br>
<input type="checkbox" name ="subject[]" value="Maths">Maths<br>
<input type="checkbox" name ="subject[]" value="Physics">Physics<br>
<input type="checkbox" name ="subject[]" value="Chemistry">Chemistry<br>
<input type="checkbox" name ="subject[]" value="Biology">Biology<br>
<input type="checkbox" name ="subject[]" value="History">History<br>
<input type="checkbox" name ="subject[]" value="Geography">Geography<br>
<input type="checkbox" name ="subject[]" value="Religious Studies">R.E.<br>
<input type="checkbox" name ="subject[]" value="French">French<br>
<input type="checkbox" name ="subject[]" value="German">German<br>
<input type="checkbox" name ="subject[]" value="Spanish">Spanish<br>
<input type="checkbox" name ="subject[]" value="Computing">Computing<br>
<input type="checkbox" name ="subject[]" value="Business">Business<br>
<input type="checkbox" name ="subject[]" value="Economics">Economics<br>
<input type="checkbox" name ="subject[]" value="Classics">Classics<br>
<input type="checkbox" name ="subject[]" value="Music">Music<br>
<input type="checkbox" name ="subject[]" value="Art">Art<br>
<input type="checkbox" name ="subject[]" value="Art">Languages<br>
<br>
<textarea id="textArea" name="comments" rows="10" cols="48">Additional Information...</textarea>
<input type="submit" name="submit" value="submit" id="submit">
</form>
</section>
<br>
<br>
<br>
<footer>
<table id="tableContainer">
<tr id="end">
<td id="tableCell">Website design and coding provided by Technology in Learning 2016
Copyright Technology in Learning <img id="til" src="../Images/company.png" height="12" width="12">
</td>
</tr>
</table>
</footer>
</div>
<?php
}
?>
</body>
</html>
这是CSS文件供参考
#container {
background-image: url(..//Images/backgroundPic.jpg);
margin-left:auto;
margin-right:auto;
background-size: cover;
width: 1000px;
border-style: ridge;
border-width: 5px;
}
h1,h2 {
text-decoration: underline;
}
p {
font-weight: bold;
}
body {
font-family: Arial, Helvetica, sans-serif;
font-size: medium;
background-color: #F1EBEB;
}
/* Header */
#top{
padding: 0px;
margin: 0px;
background-color: white;
background-image: url(../images/tutorteam.png);
height: 50px;
width: 1000px;
font-size: 1em;
}
#top img {
padding-top: 5px;
padding-left: 5px;
padding-bottom: 5px;
padding-right: 5px;
}
#details{
display: table;
padding: 10px;
}
#details p{
display:table-cell;
vertical-align:top;
padding: 3px;
}
div.tablerow {
display:table-row
}
div.tablerow p:first-child {
text-align: right;
}
#logo {
float:right;
margin-left: 4px;
margin-top :2px;
}
#back
{
float: left;
margin-left: 40px;
margin-top: 2px;
}
#main {
padding: 10px;
margin-top: 20px;
margin-left: 20px;
margin-right: 20px;
background-color: white;
}
#tableContainer {
position: absolute;
left:300px;
bottom:-350px;
display:table;
margin-left: auto;
margin-right:auto;
margin-top:0;
margin-bottom:0;
border-spacing:10px;
font-size: 0.25em;
}
#footer {
display:table-row;
}
#tableCell {
display: table-cell;
vertical-align: top;
}
#dubaiMap {
float: right;
position: relative;
right: 20px;
top: -200px;
}
#signUp {
margin-left: 110px;
margin-bottom: 100px;
border: 0px;
padding: 0px;
height: 90px;
}
#submit {
float: right;
position: relative;
bottom: 60px;
left: 420px;
margin-left: 20px;
background-color: #4CAF50; /* Green */
border: 2px solid black;
color: white;
padding: 15px 32px;
text-align: center;
text-decoration: none;
font-size: 16px;
}
textarea {
float: right;
position: relative;
bottom: 250px;
right: 175px;
border: 3px solid #4CAF50;
font-size: 14px
}
.error {
color:red;
font-weight:normal;
}
input.errorBox{
background-color: #FCD9D9;
}
最佳答案
好的,感谢那些看过这个的人。我是PHP新手,请原谅。我在代码中逐字符地逐行查找了问题。
通过逻辑检查后,此代码无法正常工作,并产生了不希望红色不显示的不良反应:
<div class="tablerow">
<p>Zip:</p>
<p> <input class="inputBox <?php if(empty($zip) && (isset($_POST['submit']))) echo 'errorBox' ?> " type="text" name="zip" value="<?php echo $zip; ?> "></p>
<span class="error">* <?php echo $required; ?></span>
</div>
通过逻辑检查后,此代码可以正常工作并产生正确的红色响应:
<div class="tablerow">
<p>Zip:</p>
<p><input class="inputBox <?php if(empty($zip) && (isset($_POST['submit']))) echo 'errorBox' ?> " type="text" name="zip" value="<?php echo $zip; ?>" ></p>
<span class="error">* <?php echo $required;?></span>
</div>
提示许多小时后感到沮丧,然后让几个人进行审查,他们也什么也没发现。
"<?php echo $zip; ?> ">
"<?php echo $zip; ?>"
对于使用这种语言编程的任何人,我都表示最崇高的敬意。我猜测产生的错误是因为没有在字符串的末尾留空字符以避免SQL注入攻击?