POST method and GET method-- radio buttons not working now [duplicate] - php

This question already has answers here:
Reference - What does this error mean in PHP?
(38 answers)
Closed 5 years ago.
I am working on a Content Management System. This particular page will be a page that the content manager can use to rate the performance of content and should have 5 radio buttons that allow the CM to rate the content 1-5 and a comment box that allows the CM to insert comments into the table. The page is linked to an index page that will GET the ID of the particular content to be reviewed. The radio buttons are not showing up and many errors are showing up such as " undefined index" of three variables- blogpostID, comment, and opt radio. Can anyone help me with this code? I first need to fix the radio buttons because they are not showing up. Then I need to correctly connect the data to MySQL so the rating and comment can be posted into the DB and so it knows to GET the ID of the blog post because that is the PK.
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" integrity="sha384-/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6M" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="css/style.css">
<!-- Navbar Code -->
<?php
require_once('PHP_functions/CM_navbar.php');
?>
<!-- End of Navbar -->
<div class="center spacer">
<h3 id = "main-title"> Rate Blog </h3>
</div>
<form action ='' method = "POST">
<div class="container">
<div class="row">
<div class="form-group">
<label for="radio-inline-group">Rating:</label>
<label class="radio-inline"><input type="radio" name="optradio" value="1">1</label>
<label class="radio-inline"><input type="radio" name="optradio" value="2">2</label>
<label class="radio-inline"><input type="radio" name="optradio" value="3">3</label>
<label class="radio-inline"><input type="radio" name="optradio" value="4">4</label>
<label class="radio-inline"><input type="radio" name="optradio" value= "5">5</label>
</div>
</div>
<div class="row">
<div class="form-group">
<label for="comment">Comment:</label>
<textarea class="form-control" rows="5" id = "comment" name="comment"></textarea>
</div>
</div>
<div class="row">
<button type="button" class="btn btn-warning">Request Revision</button>
<button type="button" class="btn btn-success">Approve</button>
</div>
</div>
<?php
$name_of_table = "Blog";
$id = $_GET['blogID'];
$rating = $_POST['optradio'];
$managerComments = $_POST['comment'];
$query = "UPDATE" .$name_of_table. "SET rating = :optradio, managerComments = :comment WHERE blogID = :blogID";
$TableInfo = getRows($query);
foreach($TableInfo as $data)
{
echo '
<tr>
<th>'.$data['ID'].'</th>
<td>'.$data['title'].'</td>
<td>'.$data['client'].'</td>
<td>'.$data['freelancer'].'</td>
<td>'.$data['Draft Due'].'</td>
<td>'.$data['Draft Received'].'</td>
<td>'.$data['onTime'].'</td>
<td>Rate</td>
</tr>';
}
?>
</form>
</body>
</html>
<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" integrity="sha384-h0AbiXch4ZDo7tp9hKZ4TsHbi047NrKGLO3SEJAg45jXxnGIfYzk4Si90RDIqNm1" crossorigin="anonymous"></script>
</body>
</html>

Currently your SQL statement is executed each time the page is visited. However on your first visit it shouldn't be executed since the user hasn't set the values yet. This is also the reason why you get "undefined index" errors because the $_POST array is empty, no form has been sent. Also, it doesn't make sense to use getRows() (whatever it does, it's not a php build in function) on an UPDATE query.
To fix your problem you have to executed the UPDATE query only when there is actually an HTML form sent by the user. You can do this with isset() to see if the $_POST array is filled with the values you need.
if (isset($_POST['optradio'], $_POST['comment'])) {
// run UPDATE query here
}
// normal SELECT query hiere
Additionally, when you want to keep using $_GET['blogID'] in your code then your HTML form must send this information as well. To do so you specify the URI you want to call in the action="" attribute of the <form> tag. It should look something like this:
<form action="yourPage.php?blogID=<?php echo (int)$_GET['blogId']; ?>" method="post">
...
</form>
This way the blogID value is still in $_GET but the form values are in $_POST.

Related

How to change the input name in Vue.js?

I'd like to use dynamic form.
and input name have to be array. then have to add array number by automatic for post.
The following is my code.
<!doctype html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="csrf-token" content="{{ csrf_token() }}">
<title></title>
<!-- Scripts -->
<!-- Fonts -->
<link rel="dns-prefetch" href="//fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css?family=Nunito" rel="stylesheet">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.4.1/css/all.css"integrity="sha384-5sAR7xN1Nv6T6+dT2mhtzEpVJvfS3NScPQTrOxhwjIuvcA67KV2R5Jz6kr4abQsz"crossorigin="anonymous">
<!-- Styles -->
<link href="{{ asset('css/app.css') }}" rel="stylesheet" >
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>
<body>
<form action="" method="post">
<div id="sample">
<button v-on:click="addNewItemForm">New Item</button>
<div v-for="(item, index) in items">
<span style="coursor:pointer" v-on:click="deleteItemForm(index)">close</span>
<div>
<div>number({{index+1}})</div>
<div>
<label>Title:</label>
<div>
<input type="text" name="title[{{index}}]" required placeholder="here is title" v-model="item.title">
<p class="alert-warning">{{item.title}}</p>
</div>
</div>
<div>
<label>Detail:</label>
<div>
<input type="text" name="detail[{{index}}]" required placeholder="here is detail" v-model="item.detail">
<p>{{item.detail}}</p>
</div>
</div>
</div>
</div>
<div class="text-center mt-3">
<button type="submit" class="btn btn-success px-3">Register</button>
</div>
</div>
</form>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</body>
</html>
<script>
var app = new Vue ({
name:'Sample-app',
el:'#sample',
data:{
items:[
{
title:'',
detail:''
}
]
},
methods:{
addNewItemForm(){
this.items.push({
title:'',
detail:''
})
},
deleteItemForm(index){
this.items.splice(index,1)
}
}
})
</script>
here is link in code pen.
You can check this form.
[https://codepen.io/takudemo/pen/NWPBYMe?fbclid=IwAR3bpfc3IuI6cz7Y02ZgGGetDkDIHb5aC4op4earENzKYIkftPE2ZzzI51Q]
and I tried like this.
<div>
<input type="text" name="title[{{index}}]" required placeholder="here is title" v-model="item.title">
<p class="alert-warning">{{item.title}}</p>
</div>
also detail.
but It's not working.
and The following is error message.
[Vue warn]: Error compiling template:
name="title[{{index}}]": Interpolation inside attributes has been removed. Use v-bind or the colon shorthand instead. For example, instead of <div id="{{ val }}">, use <div :id="val">.
8 | <label>Title:</label>
9 | <div>
10 | <input type="text" name="title[{{index}}]" required="" placeholder="here is title" v-model="item.title">
| ^^^^^^^^^^^^^^^^^^^^^^^^^^^
11 | <p class="alert-warning">{{item.title}}</p>
12 | </div>
If you have any ideas that to solve it.
Please let me know.
First, if you want to set some attribute dynamically in VueJS use :.
Second, even if you try :name="title[index]" it won't work because you don't have title array in your data. You have only items array. Add title and detail arrays in 'data' if you want to set names from them.
But I suppose that you want to generate names with title and detail properties of the corresponding item.
So, instead of this: name="detail[{{index}}]" and name="detail[{{index}}]"
use this: :name="item.title" and :name="item.detail".
And also save something to title and detail in addNewItemForm to see the changes, for example, like this:
addNewItemForm(){
this.items.push({
title:'title' + (this.items.length+1),
detail:'detail' + (this.items.length+1)
})
The issue you are facing here is that you want to dynamically set a tag attribute. In order to achieve that you need the : or v-bind: syntax. On top of that an html attribute is always a string. Hence, having these 2 things in mind what you are looking for is:
<input type="text" :name="`title[${index}]`"
required="" placeholder="here is title" v-model="item.title">
P.S.:Having that said, I would reconsider using that name as it feels you are trying to use a javascript object while it is purely a string.

How can I display data on a table based on the selected option on the dropdown menu?

I need based on the user selected, to display data from that same user and everything that is in the database table.
When a user is selected through the dropdown menu and the button "search" is clicked, I need a table that pops up with all the data regarding that user.
This is the part where I get the users to show up in the drop down menu.
But I'm a noob at coding so I have no idea where to go next, any help is appreciated.
<?php
session_start();
require 'includes/dbh.inc.php';
?>
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link rel="stylesheet" href="css/footer.css">
<title>Document</title>
</head>
<body>
<div class="container h-100">
<div class="row h-100 justify-content-center align-items-center">
<form method="post" action="includes/shifts.inc.php" class="col-10">
<div class="form-group text-center">
<br>
<h1 class="h3 mb-3 text-center font-weight-normal">Create new shift</h1>
<label for="form">Name</label>
<select name="uid" class="form-control" required autofocus>
<?php
$res=mysqli_query($conn, "SELECT * FROM users");
while($row=mysqli_fetch_array($res))
{
?>
<option name="uid"><?php echo $row["uidUsers"]; ?></option>
<?php
}
?>
</select>
</div>
</form>
</div>
</div>
<button class="btn btn-lg btn-primary btn-block" name="search" type="submit">Search</button>
</body>
</html>
Does it need to be on the same page or another one?
EDIT 1:
So, I gave you part of the solution for your problem. You'll still ned to change some value depending of your data. I wrote alot of comment in the Javascript code in the example, so read them carefully because I explain everything that I'm doing. Hope that will help you! If you still have some problem with the PHP script part, feel free to ask.
<?php
session_start();
require 'includes/dbh.inc.php';
?>
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link rel="stylesheet" href="css/footer.css">
<title>Document</title>
</head>
<body>
<div class="container h-100">
<div class="row h-100 justify-content-center align-items-center">
<form method="post" action="includes/shifts.inc.php" class="col-10">
<div class="form-group text-center">
<br>
<h1 class="h3 mb-3 text-center font-weight-normal">Create new shift</h1>
<label for="form">Name</label>
<select name="uid" class="form-control" required autofocus>
<?php
$res=mysqli_query($conn, "SELECT * FROM users");
while($row=mysqli_fetch_array($res)): ?> <!-- Use adapted version of while for easier reading in HTML -->
<option value="<?php echo $row["id_of_user"]; ?>"><?php echo $row["uidUsers"]; ?></option> <!-- Here, you don't need to 'name' your option, you only need to give them value and id (optionnal). You need to change $row["id_of_user"] for the first of the ID of user -->
<?php endwhile; ?>
</select>
</div>
</form>
</div>
</div>
<button class="btn btn-lg btn-primary btn-block" name="search" type="submit">Search</button>
<!--
THIS IS THE NEW TABLE WHERE WE'LL PLACE OUR DATA
-->
<table id="userTable" style="display:none">
<tbody>
<tr>
<th>First name</th>
<td id="firstName"></td>
</tr>
<tr>
<th>Last name</th>
<td id="lastName"></td>
</tr>
<tr>
<th>Birth date</th>
<td id="birthDate"></td>
</tr>
</tbody>
</table>
</body>
</html>
<script>
// So first of all, we'll create a listener to capture when the user click on an <option>
$("select[name=uid] option").on('click', function() {
// Get the value of the clicked option (suposed to be the ID of the user)
let id = $(this).attr("value");
// Let's make an AJAX call to get the user ID
$.ajax({
// Instead of "url", you'll put the url path of the script
// you created to send the information back to this request
url: "url",
// This option is where you pass the value you want to send to the PHP script
// Here we'll send the id of the user we want info from
data: {
"id": id
},
// This option is to make our life easier because it will automaticly decode
// the data the script is sending us from JSON type
dataType: 'json',
// This option is a function called when the request is a success
success: function (response) {
/*
For the purpose of the demonstration, the script will be returning
the first name, the last name and the birth date of the user
you selected with the select.
So, the `response` variable (right above), contain the 3 value
as a JSON. Because of the 'dataType' option, this is no longer a JSON,
but a Javascript array now. So we'll get each value this way:
response.firstName
response.lastName
response.birthDate
This way, we'll be able to put those value in the table. Since
the table is hidden, we'll display it with this jQuery function:
.show()
And we'll put the value in the first with the following lines:
*/
// Grab the value from the request
let firstName = response.firstName;
let lastName = response.lastName;
let birthDate = response.birthDate;
// Put them in the table
$("#firstName").val(firstName);
$("#lastName").val(lastName);
$("#birthDate").val(birthDate);
// Show the table
$("#userTable").show();
},
});
})
</script>
PS: I'm using jQuery for change table value and making an HTTP request. You can see all information about this library here https://jquery.com/ and about the $.ajax() function here https://api.jquery.com/jquery.ajax/
To send an ajax request following a change even on the select menu you might consider using an ajax function which will send the selected option value to a backend script to process. The backend script does a db lookup and returns the data in some form ( json, html, xml ) which is then processed by the ajax callback function.
The following is semi-pseudo code and is, of course, untested.
<?php
# /some/script.php
require 'includes/dbh.inc.php';
$sql='select * from users where uid=?';
$stmt=$conn->prepare( $sql );
$stmt->bind_param( 's', $uid );
$uid=$_POST['uid'];
$res=$stmt->execute();
$data=$stmt->get_result();
$stmt->close();
$conn->close();
exit( json_encode( $data ) );
?>
<select name="uid" class="form-control" required autofocus>
......
</select>
<script>
let ajax_target='/path/to/some/script.php';
document.querySelector('select[name="uid"]').addEventListener('change',function(e){
let xhr=new XMLHttpRequest();
xhr.onreadystatechange=function(){
if( this.status==200 && this.readyState==4 ){
( e )=>{
alert( e.response )
}
}
}
xhr.open( 'POST', ajax_target, true );
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
xhr.send( 'uid='+this.value );
});
</script>

passing id on href and submitting form on same page

I am making social project form and im trying to add reply ..the reply button is a link that sends user to reply.php page with post id saved in href...on the reply.php my form action is the same page but when i click button to submit form it doesnot get the id and refreshes page with post and display error undefined id need help..
here is my reply.php
<?php
require('session.php');
$id=$_GET['id'];
//echo $id;
$submit=#$_POST['submit'];
$reply=#$_POST['reply'];
if(isset($submit)){
$id=#$_GET['id'];
$sql=mysqli_query($con,"INSERT INTO REPLY (reply,Username,post_id) VALUES '$reply','$user_check','$id'");
$sql2=mysqli_query($con,"SELECT * FROM REPLY WHERE post_id= '$id'");
while($row=mysqli_fetch_array($sql2)){
echo $row['Username']."<br/>".$row['reply']."<br/>";
}
}
else "error in submission";
?>
<!DOCTYPE html>
<html>
<title>Studhelp</title>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="w3.css">
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
<script src="bootstrap/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Raleway">
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.min.css">
<?php
$sql=mysqli_query($con,"select * from posts where post_id='$id'");
while($row=mysqli_fetch_array($sql)){?>
<!-- Middle Column -->
<div class="w3-col m7">
<div class="w3-row-padding">
<div class="w3-col m12">
<div class="w3-card-2 w3-round w3-white">
<div class="w3-container w3-padding">
<h3 class="w3-opacity"><?php echo $row['Username'] ;?></h3>
<?php
echo $row['Posts']."<br/>".$row['date']."<br/>";
}
?>
</p>
</div>
</div>
</div>
</div>
<form action="reply.php" method="post">
<input type="text" name="reply" >
<input type="submit" name="submit" value="reply">
</form>
this is the anchor tag send id to reply.php
Reply
If I understand correct you need to be able to read your "id" variable after you post the form. To achieve this use $_REQUEST instead of $_GET, like this:
$id = $_REQUEST['id'];
And also pass the variable with your form, as a hidden field:
<form action="reply.php" method="post">
<input type="hidden" name="id" value="<?php echo $id; ?>" />
<input type="text" name="reply" />
<input type="submit" name="submit" value="reply" />
</form>
You didn't check if the fom was submitted
Enclose other PHP code after session.php inside a conditional checker such as:
if ($_POST):
You can use form tags to create a form and put the id field as hidden.
GET requests shouldn't be use to modify data

Bootstrap: active class

In bootstrap, active class is used to get selected radio button value. When a radio button is clicked, active class is added to label of that button. After submitting the form value of radio button with active label is sent for further processing.
However when the active class is added from jquery and form is submitted, it doesn't post/get value of that button. To make this work I have to simulate the click on radio button with active class.
Am I doing something wrong ?
Is there any other way to achieve this ?
<?php
$value = 1;
?>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<script src="js/jquery-2.1.4.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/bootstrap-theme.min.css">
<script>
function showOption() {
$(document).ready(function () {
$('#option_grp input[value=<?php echo "$value"?>]').parent('label').addClass('active').click();
});
}
</script>
</head>
<body onload="showOption()">
<div class="container">
<form method="post" action="getValue.php">
<div id="option_grp" class="btn-group" data-toggle="buttons">
<label class="btn btn-primary">
<input type="radio" name="pr_type" value="1">Option 1
</label>
<label class="btn btn-primary">
<input type="radio" name="pr_type" value="2">Option 2
</label>
</div>
<input type="submit" name="submit" value="Submit">
</form>
</div>
</body>
</html>
getValue.php
$pr_type=$_POST['pr_type'];
echo "pr_type : ".$pr_type;
In order for a radio button value to be sent to the server during a POST request, it must be marked as "checked". You can do this more than one way.
For example:
You can simulate a user clicking on the radio button which will cause the radio button to be selected.
You can mark the radio button checked by setting the "checked" attribute to "checked". See this answer for reference.
Either way should work, but the second method would be preferable. Once the radio button is checked, it can be styled however you like. Use can use the Bootstrap class 'active' or any other that you like, but the styling will have no bearing on what is sent back to the server.

PHP session back button?

Ok. So I am using Sessions to store data because I am making a multi page form. The thing is, I need a back button with it. I have a submit button that will take the user to the next page and store the data into sessions but I need a back button next to the submit button in case they messed up for whatever reason. Is there anyway to make a back button with php that will take them back to the previous page while showing the data they entered? heres my code of one page.
Also, I have tried using the history.go but that only works for one page.
<?php
//let's start the session
session_start();
//now, let's register our session variables
$_SESSION['opinion1'] = 'opinion1';
$_SESSION['choice1'] = 'choice1';
//finally, let's store our posted values in the session variables
$_SESSION['opinion1'] = $_POST['opinion1'];
$_SESSION['choice1'] = $_POST['choice1'];
?>
<!DOCTYPE html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href='http://fonts.googleapis.com/css?family=Playball' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="bootstrap.css">
<link rel="stylesheet" href="main.css">
<link rel="stylesheet" type="text/css" href="engine1/style.css" />
<script type="text/javascript" src="engine1/jquery.js"></script>
<script src="jquery.cycle2.js"></script>
<title>Untitled Document</title>
</head>
<body>
<div class="nav">
<div class="container">
<h1 class="pull-left">Securing the Future of Village Walk</h1>
<div class="pull-right">
<ul class="nav nav-pills">
<li class="active">home</li>
<li>about</li>
<li>contact</li>
</ul>
</div>
</div>
</div>
<div class="ammendment">
<div class="container">
<form method="post" action="page4_form.php">
<textarea id="opinion2" name="opinion2" value=""></textarea>
<label for="Yes">Yes</label>
<input type="radio" name="choice2" value="Yes">
<label for="No">No</label>
<input type="radio" name="choice2" value="No">
<label for="Neither">Neither</label>
<input type="radio" name="choice2" value="Neither">
**I NEED BACK BUTTON HERE**
<input type="submit" value="Next">
</form>
</div>
</div>
</body>
</html>
I would first organize session data in a way that it's easy for you to correlate data entered with the page it was entered.
One possibility could be to organize session data in an array:
$_SESSION['formData'] = array(
array(... data for step 1 ),
array(... data for step 2 ),
array(... data for step 3 ),
);
So $formData[0] would hold data entered in step 1, etc.
As for the button, another submit would be enough:
<input type="submit" value="Back" />
Then, you would have to determine which page you are going back to; which you can achieve by sending a hidden field with the current page number.
<form method="post" action="page_form.php">
<input type="hidden" name="page" value="X" />
One thing to note here is that the server side process would not longer be one-per-page; instead there would be only one page_form.php where you'll have to determine the action and the page to move to (although you could use one per page and set the right action in the , there's always several solutions to any problem):
<?php
...
$page = $_POST['page'];
if ( isset($_POST['Back']) ) // Going back
{
$page -= 1; // Previous page requested
// Retrieve data from session
$data = $_SESSION['formData'][$page-1]; // $page-1 because of zero based array indexes.
...
// Dynamically load the proper page processor.
// each pageX_form.php will know how to deal with the variable $data.
include "page{$page}_form.php"
}
else
{
$page += 1; // Next page requested
$data = $_POST; // In this case, the data is whatever was entered
}
When building the form for each page, you'd have to remember to add the hidden field with the page number:
<form method="post" action="page_form.php">
<input type="hidden" name="page" value="<?php echo $page; ?>" />
If you wanted to use one server-side process per page, then you could do something like this instead:
<form method="post" action="page<?php echo $page; ?>_form.php">
The server-side process would look different, since you would not have to ask for the page number; it would be implicit.
You could just add an additional form like so:
<form action="pageX.php" method="post>
<input name="submitBackButton" type="submit" value="Back">
</form>
This can be detected as a normal GET / POST field within PHP:
<?php
if (isset($_POST['submitBackButton']))
{
// Do required actions here
}

Categories