i just built up a simple contact form and i am facing a problem previewing it in same file and same page .
In this coding, there is 3 types of division :
The file name form.php .
Here is the code :
<?php
// validate data
$fnameErr = $lnameErr = "";
if ($_SERVER["REQUEST_METHOD"] == "POST") {
if (empty($_POST["fname"])) {
$fnameErr = "First name is required";
}
elseif (preg_match("/^[A-Z][a-zA-Z -]+$/", $_POST["fname"]) === 0) {
$fnameErr = "First name must contain letters and spaces only";
}
else {
$fname = $_POST["fname"];
}
if (empty($_POST["lname"])) {
$lnameErr = "Last name is required";
}
elseif (preg_match("/^[A-Z][a-zA-Z -]+$/", $_POST["lname"]) === 0) {
$lnameErr = "Last name must contain letters and spaces only";
}
else {
$lname = $_POST["lname"];
}
}
?>
// 1st variant that will be form
<title>Untitled 1</title>
<style type="text/css">
.style1 {
border-collapse: collapse;
border: 1px solid #000000;
background-color: #99FF99;
}
.style3 {
text-align: center;
font-size: large;
}
.style4 {
color: #0000FF;
}
.style5 {
text-align: center;
}
.style6 {
background-color: #FEFECB;
}
.error {
color: #FF0000;
}
</style>
<script src="jquery-1.10.2.js"></script>
</head>
<body>
<table style="width: 600px" cellspacing="0" cellpadding="25" align="center" class="style1">
<tr>
<form method="POST"
action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>"> <td>
<div class="style3">
:: <strong><span class="style4">STUDENT INFORMATION</span> </strong>
::</div>
<table style="width: 100%">
</table>
<table style="width: 100%" class="style6" cellpadding="5">
<tr>
<td style="height: 30px; width: 106px">First Name </td>
<td style="width: 14px; height: 30px;" class="style5"><strong>:</strong></td>
<td style="width: 204px; height: 30px;"><input name="fname" type="text" value="<?php echo htmlspecialchars($fname);?>"> </td>
<td style="height: 30px"><span class="error"><?php echo $fnameErr;?></span></td>
</tr>
<tr>
<td style="width: 106px"> </td>
<td style="width: 14px" class="style5"><strong></strong></td>
<td style="width: 204px"> </td>
<td> </td>
</tr>
<tr>
<td style="width: 106px">Last Name</td>
<td style="width: 14px" class="style5"><strong>:</strong></td>
<td style="width: 204px"><input name="lname" type="text" value="<?php echo htmlspecialchars($lname);?>"></td>
<td><span class="error"><?php echo $lnameErr;?></span></td>
</tr>
</table>
</td>
</form>
</tr>
</table>
</body>
</html>
//--------this code below i want to become as preview page , 2nd variant page that will be switch on after validation complete ---------
<body>
<table style="width: 600px" cellspacing="0" cellpadding="25" align="center" class="style1">
<tr>
<td>
<div class="style3">
:: <strong><span class="style4">STUDENT INFORMATION</span> </strong>
::</div>
<table style="width: 100%">
</table>
<table style="width: 100%" class="style6" cellpadding="5">
<tr>
<td style="height: 27px; width: 106px">First Name </td>
<td style="width: 14px; height: 27px;" class="style5"><strong>:</strong></td>
<td style="width: 204px; height: 27px;"><?php echo $fname ?> </td>
<td style="height: 27px"><span class="error"></span></td>
</tr>
<tr>
<td style="width: 106px"> </td>
<td style="width: 14px" class="style5"><strong></strong></td>
<td style="width: 204px"> </td>
<td> </td>
</tr>
<tr>
<td style="width: 106px">Last Name</td>
<td style="width: 14px" class="style5"><strong>:</strong></td>
<td style="width: 204px"> <?php echo $lname ?></td>
<td><span class="error"></span></td>
</tr>
<tr>
<td style="width: 106px"> </td>
<td style="width: 14px" class="style5"><strong></strong></td>
<td style="width: 204px"> </td>
<td> </td>
</tr>
<tr>
<td style="width: 106px"> </td>
<td style="width: 14px" class="style5"><strong></strong></td>
<td style="width: 204px"> </td>
<td> </td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
, Any feedback is really appreciated , thank you!
First of all change your:
<form method="POST"
action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>">
to
<form method="POST" action="">
2nd point - you have to decide what is your condition to show 2nd variant of page.
For example:
if (isset($POST['fname']) && $_POST['fname']==$fname
&& isset($POST['lname']) && $_POST['lname']==$lname ) {$setPageVariant = 'noform';} else {$setPageVariant = 'form';};
put this line right before html part start (line #27-28)
3rd. In your html replace:
<form method="POST" action="">
with
<?php if ($setPageVar=='form') { ?> <form method="POST" action=""> <?php } ?>
and same condition but with else for inputs. replace for example:
<input name="fname" type="text" value="<?php echo htmlspecialchars($fname);?>">
with
<?php if ($setPageVar=='form') { ?>
<input name="fname" type="text" value="<?php echo htmlspecialchars($fname);?>">
<?php } else { echo $fname; } ?>
I hope you've got an idea and can go ahead in your project :-) Good luck!