I have a form page named reg_apply_form.php and a action page named preview.php after complete the form when I click preview button, my action page show all value. If I think, my information is wrong, then I will click back button. But problem is, if I click back button, all of my value is remove. I want to back my form page with all value if click Back button. my two pages code are given below:
Form page code:
<!DOCTYPE html>
<head>
</head>
<body id="body">
<form action="preview.php" method="post" class="form-inline vh_pre_reg_form">
<div class="form-group">
<label>First Name</label>
<input name="fname" id="one" type="text" class="form-control" placeholder="Your First Name">
</div>
<div class="form-group">
<label>Last Name</label>
<input name="lname" id="two" type="text" class="form-control" placeholder="Your Last Name" />
</div>
<div class="form-group">
<label>Email</label>
<input name="email" id="txtEmail" type="email" class="form-control" placeholder="Your Email" />
</div>
<div class="form-group">
<label>Address</label>
<input name="address" type="text" id="four" class="form-control" placeholder="Your Address" />
</div>
<div class="form-group">
<label>Phone Number</label>
<input name="vh_rg_phone" type="text" pattern="[0-9]{6,}" id="vh_rg_phone" class="form-control" placeholder="Your Phone Number" />
</div>
<div class="form-group">
<label>Mobile Number</label>
<input name="vh_rg_mob" type="number" pattern="\d{11}" id="vh_rg_mob" class="form-control" placeholder="Your Mobile Number" />
</div>
<div class="form-group">
<label>Father's Name</label>
<input name="vh_reg_father_name" type="text" id="vh_reg_fname" class="form-control" placeholder="Your Father's Name" />
</div>
<div class="form-group">
<label>Father's Contact</label>
<input name="vh_reg_father_con" type="number" pattern="\d{11}" id="vh_rg_fcontact" class="form-control" placeholder="Your Father's Contact" />
</div>
<div class="form-group">
<label>Mother's Name</label>
<input name="vh_reg_mother_name" type="text" id="vh_reg_mname" class="form-control" placeholder="Your Mother's Name" />
</div>
<div class="form-group">
<label>Mother's Contact</label>
<input name="vh_reg_mother_con" type="number" pattern="\d{11}" id="vh_reg_mcontact" class="form-control" placeholder="Your Mother's Contact" />
</div>
<div class="form-group">
<label>Guardian Name</label>
<input name="vh_reg_gaurdi_name" type="text" id="vh_reg_guardi_name" class="form-control" placeholder="Your Guardian Name" />
</div>
<div class="form-group">
<label>Guardian Contact</label>
<input name="vh_reg_gaurdi_con" type="number" pattern="\d{11}" id="vh_rg_guardi_contact" class="form-control" placeholder="Your Guardian Contact" />
</div>
<div class="form-group table">
<label>Date of Birth <strong>*</strong></label>
<input type="date" id="birthday" name="birth_date" />
</div>
<div class="form-group">
<label>Password Number</label>
<input name="mainpass" type="password" id="mainpass" class="form-control" placeholder="Make Your Password" />
</div>
<div class="form-group">
<label>Confirm Password</label>
<input name="conpass" type="password" id="conpass" class="form-control" placeholder="Type Your Password Again" />
</div>
<input name="submit" id="btnValidate" type="submit" value="Preview"/>
<input type="reset" value="Clear All"/>
</form>
</body>
</html>
And my action page code:
<?php
if($_POST && isset($_POST['mainpass'], $_POST['fname'], $_POST['lname'], $_POST['conpass'], $_POST['email'])){
if($_POST['mainpass'] == $_POST['conpass']){
$fname = "$_POST[fname]";
$lname = "$_POST[lname]";
$email = "$_POST[email]";
$address = "$_POST[address]";
$student_phone = "$_POST[vh_rg_phone]";
$student_mobile = "$_POST[vh_rg_mob]";
$religion = "$_POST[religion]";
$father = "$_POST[vh_reg_father_name]";
$father_contact = "$_POST[vh_reg_father_con]";
$mother = "$_POST[vh_reg_mother_name]";
$mother_contact = "$_POST[vh_reg_mother_con]";
$guardian = "$_POST[vh_reg_gaurdi_name]";
$date_of_birth = "$_POST[birth_date]";
$guardian_contact = "$_POST[vh_reg_gaurdi_con]";
$password = "$_POST[mainpass]";
} else{header("Location: go.php");}
}
else{
header("Location: no.php");
}
?>
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<title></title>
</head>
<body>
<form action="password.php" method="post" class="form-inline vh_pre_reg_form">
<div class="form-group">
<label>First Name</label>
<span><?php echo $fname; ?></span>
</div>
<div class="form-group">
<label>Last Name</label>
<span><?php echo $lname; ?></span>
</div>
<div class="form-group">
<label>Email</label>
<span><?php echo $email; ?></span>
</div>
<div class="form-group">
<label>Address</label>
<span><?php echo $address; ?></span>
</div>
<div class="form-group">
<label>Phone Number</label>
<span><?php echo $student_phone; ?></span>
</div>
<div class="form-group">
<label>Mobile Number</label>
<span><?php echo $student_mobile; ?></span>
</div>
<div class="form-group">
<label>Father's Name</label>
<span><?php echo $father; ?></span>
</div>
<div class="form-group">
<label>Father's Contact</label>
<span><?php echo $father_contact; ?></span>
</div>
<div class="form-group">
<label>Mother's Name</label>
<span><?php echo $mother; ?></span>
</div>
<div class="form-group">
<label>Mother's Contact</label>
<span><?php echo $mother_contact; ?></span>
</div>
<div class="form-group">
<label>Guardian Name</label>
<span><?php echo $guardian; ?></span>
</div>
<div class="form-group">
<label>Guardian Contact</label>
<span><?php echo "here will be date" . $guardian_contact; ?></span>
</div>
<div class="form-group table">
<label>Date of Birth <strong>*</strong></label>
<span><?php echo $date_of_birth;?></span>
</div>
<input name="submit" id="btnValidate" type="submit" value="Submit"/>
<a href="reg_apply_form.php"><input type="button" value="Back"/></a>
</form>
</body>
</html>
I don't know how can I do this. Please help me. If possible, ans me with full code please. Thank you
One way for make this is Ajax request and insert directly response on your actual page.
For example: i have add a div around your main form and a div for preview content. When the form is submit for preview, i hide the main div and show the preview div with result.
Now when the user click back button, i hide the preview div and show the main div.
UPDATE
MAIN HTML
<!DOCTYPE html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('input#btnValidate').click( function() {
$.ajax({
url: 'preview.php',
type: 'post',
dataType: 'html',
data: $('form#vh_pre_reg_form').serialize(),
success: function(data) {
$("#containerMain").hide();
$("#containerPreview").show();
$("#containerPreview").html(data);
}
});
});
$(document).on("click","#back", function() {
$("#containerPreview").html("").hide();
$("#containerMain").show();
})
})
</script>
</head>
<body id="body">
<div id="containerMain">
<form action="preview.php" method="post" id="vh_pre_reg_form" class="form-inline vh_pre_reg_form">
<div class="form-group">
<label>First Name</label>
<input name="fname" id="one" type="text" class="form-control" placeholder="Your First Name">
</div>
<div class="form-group">
<label>Last Name</label>
<input name="lname" id="two" type="text" class="form-control" placeholder="Your Last Name" />
</div>
<div class="form-group">
<label>Email</label>
<input name="email" id="txtEmail" type="email" class="form-control" placeholder="Your Email" />
</div>
<div class="form-group">
<label>Address</label>
<input name="address" type="text" id="four" class="form-control" placeholder="Your Address" />
</div>
<div class="form-group">
<label>Phone Number</label>
<input name="vh_rg_phone" type="text" pattern="[0-9]{6,}" id="vh_rg_phone" class="form-control" placeholder="Your Phone Number" />
</div>
<div class="form-group">
<label>Mobile Number</label>
<input name="vh_rg_mob" type="number" pattern="\d{11}" id="vh_rg_mob" class="form-control" placeholder="Your Mobile Number" />
</div>
<div class="form-group">
<label>Father's Name</label>
<input name="vh_reg_father_name" type="text" id="vh_reg_fname" class="form-control" placeholder="Your Father's Name" />
</div>
<div class="form-group">
<label>Father's Contact</label>
<input name="vh_reg_father_con" type="number" pattern="\d{11}" id="vh_rg_fcontact" class="form-control" placeholder="Your Father's Contact" />
</div>
<div class="form-group">
<label>Mother's Name</label>
<input name="vh_reg_mother_name" type="text" id="vh_reg_mname" class="form-control" placeholder="Your Mother's Name" />
</div>
<div class="form-group">
<label>Mother's Contact</label>
<input name="vh_reg_mother_con" type="number" pattern="\d{11}" id="vh_reg_mcontact" class="form-control" placeholder="Your Mother's Contact" />
</div>
<div class="form-group">
<label>Guardian Name</label>
<input name="vh_reg_gaurdi_name" type="text" id="vh_reg_guardi_name" class="form-control" placeholder="Your Guardian Name" />
</div>
<div class="form-group">
<label>Guardian Contact</label>
<input name="vh_reg_gaurdi_con" type="number" pattern="\d{11}" id="vh_rg_guardi_contact" class="form-control" placeholder="Your Guardian Contact" />
</div>
<div class="form-group table">
<label>Date of Birth <strong>*</strong></label>
<input type="date" id="birthday" name="birth_date" />
</div>
<div class="form-group">
<label>Password Number</label>
<input name="mainpass" type="password" id="mainpass" class="form-control" placeholder="Make Your Password" />
</div>
<div class="form-group">
<label>Confirm Password</label>
<input name="conpass" type="password" id="conpass" class="form-control" placeholder="Type Your Password Again" />
</div>
<input name="submit" id="btnValidate" type="button" value="Preview"/>
<input type="reset" value="Clear All"/>
</form>
</div>
<div id="containerPreview" style="display:none"></div>
</body>
</html>
PHP
<?php
$fname = "$_POST[fname]";
$lname = "$_POST[lname]";
$email = "$_POST[email]";
$address = "$_POST[address]";
$student_phone = "$_POST[vh_rg_phone]";
$student_mobile = "$_POST[vh_rg_mob]";
$religion = "$_POST[religion]";
$father = "$_POST[vh_reg_father_name]";
$father_contact = "$_POST[vh_reg_father_con]";
$mother = "$_POST[vh_reg_mother_name]";
$mother_contact = "$_POST[vh_reg_mother_con]";
$guardian = "$_POST[vh_reg_gaurdi_name]";
$date_of_birth = "$_POST[birth_date]";
$guardian_contact = "$_POST[vh_reg_gaurdi_con]";
$password = "$_POST[mainpass]";
?>
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<title></title>
</head>
<body>
<form action="password.php" method="post" class="form-inline vh_pre_reg_form">
<div class="form-group">
<label>First Name</label>
<span><?php echo $fname; ?></span>
</div>
<div class="form-group">
<label>Last Name</label>
<span><?php echo $lname; ?></span>
</div>
<div class="form-group">
<label>Email</label>
<span><?php echo $email; ?></span>
</div>
<div class="form-group">
<label>Address</label>
<span><?php echo $address; ?></span>
</div>
<div class="form-group">
<label>Phone Number</label>
<span><?php echo $student_phone; ?></span>
</div>
<div class="form-group">
<label>Mobile Number</label>
<span><?php echo $student_mobile; ?></span>
</div>
<div class="form-group">
<label>Father's Name</label>
<span><?php echo $father; ?></span>
</div>
<div class="form-group">
<label>Father's Contact</label>
<span><?php echo $father_contact; ?></span>
</div>
<div class="form-group">
<label>Mother's Name</label>
<span><?php echo $mother; ?></span>
</div>
<div class="form-group">
<label>Mother's Contact</label>
<span><?php echo $mother_contact; ?></span>
</div>
<div class="form-group">
<label>Guardian Name</label>
<span><?php echo $guardian; ?></span>
</div>
<div class="form-group">
<label>Guardian Contact</label>
<span><?php echo "here will be date" . $guardian_contact; ?></span>
</div>
<div class="form-group table">
<label>Date of Birth <strong>*</strong></label>
<span><?php echo $date_of_birth;?></span>
</div>
<input name="submit" id="btnValidate" type="submit" value="Submit"/>
<input id="back" type="button" value="Back"/>
</form>
</body>
</html>
It's work fine.