Php - multi-step form with file upload

Asked
Active3 hr before
Viewed126 times

5 Answers

upload
90%

I can't seem to find clarification. I have 7 steps and the second one is to upload a file. The problem I am having is that on the final step when I finalize the form and try and access the temp file it says "Could not access file: ..." (saved in the default tmp folder)., Stack Overflow for Teams Where developers & technologists share private knowledge with coworkers ,After the upload, you should actually save the file in some folder, maybe with the user's session id as name. Then, with the last step, you should move that file to its definitive location., Alright, thanks for the clarification. Just a follow-up, how can I properly manage the temp folder like PHP does? If people stop after uploading and the file sits in the temp folder do I create a script to delete all files that are past a certain date/time? If so, do I run this when I upload files? – user162941 Oct 5 '11 at 17:15

load more v
88%

Before begin, take a look on files structure. We have used following files for this tutorial.,We will also need CSS code in head tag in index.php to hide forms that kept inside <fieldset> to show and hide using jQuery.,Convert Unix Timestamp To Readable Date Time in PHP, Save my name, email, and website in this browser for the next time I comment.


CREATE TABLE IF NOT EXISTS `user`(
   `id`
   int(11) NOT NULL AUTO_INCREMENT,
   `email`
   varchar(100) NOT NULL,
   `password`
   varchar(100) NOT NULL,
   `first_name`
   varchar(100) NOT NULL,
   `last_name`
   varchar(100) NOT NULL,
   `mobile`
   int(11) NOT NULL,
   `address`
   text NOT NULL,
   PRIMARY KEY(`id`)
) ENGINE = InnoDB DEFAULT CHARSET = latin1 AUTO_INCREMENT = 1;
load more v
72%

By seeing popularity of such forms, we bring this tutorial to create a multi page form using PHP script. However, we have already covered multi step form using jQuery and JavaScript.,You said “However, we have already covered multi step form using jQuery and JavaScript” – could you please provide a link to where you did that?, richard says: August 1, 2020 at 8:59 pm You said “However, we have already covered multi step form using jQuery and JavaScript” – could you please provide a link to where you did that? Reply ,A multi page form in PHP can be created using sessions, that are used to retain values of a form and can transfer them from one page to another .

PHP file: page1_form.php
Given below are the codes for first part of the form, as user fills it and clicks on next button, it will redirect to second page .

<?php
session_start(); // Session starts here.
?><!DOCTYPE HTML>
<html>
 <head>
 <title>PHP Multi Page Form</title>
 <link rel="stylesheet" href="style.css" />
 </head>
 <body>
 <div class="container">
 <div class="main">
 <h2>PHP Multi Page Form</h2>
 <span id="error">
 <!---- Initializing Session for errors --->
 <?php
 if (!empty($_SESSION['error'])) {
 echo $_SESSION['error'];
 unset($_SESSION['error']);
 }
 ?>
 </span>
 <form action="page2_form.php" method="post">
 <label>Full Name :<span>*</span></label>
 <input name="name" type="text" placeholder="Ex-James Anderson" required>
 <label>Email :<span>*</span></label>
 <input name="email" type="email" placeholder="[email protected]" required>
 <label>Contact :<span>*</span></label>
 <input name="contact" type="text" placeholder="10-digit number" required>
 <label>Password :<span>*</span></label>
 <input name="password" type="Password" placeholder="*****" />
 <label>Re-enter Password :<span>*</span></label>
 <input name="confirm" type="password" placeholder="*****" >
 <input type="reset" value="Reset" />
 <input type="submit" value="Next" />
 </form>
 </div>
 </div>
 </body>
</html>

PHP file: page3_form.php
In the below script, we validate all fields of page2 and set sessions for page2 errors.

<?php
session_start();
// Checking second page values for empty, If it finds any blank field then redirected to second page.
if (isset($_POST['gender'])){
 if (empty($_POST['gender'])
 || empty($_POST['nationality'])
 || empty($_POST['religion'])
 || empty($_POST['qualification'])
 || empty($_POST['experience'])){ 
 $_SESSION['error_page2'] = "Mandatory field(s) are missing, Please fill it again"; // Setting error message.
 header("location: page2_form.php"); // Redirecting to second page. 
 } else {
 // Fetching all values posted from second page and storing it in variable.
 foreach ($_POST as $key => $value) {
 $_SESSION['post'][$key] = $value;
 }
 }
} else {
 if (empty($_SESSION['error_page3'])) {
 header("location: page1_form.php");// Redirecting to first page.
 }
}
?>
<!DOCTYPE HTML>
<html>
 <head>
 <title>PHP Multi Page Form</title>
 <link rel="stylesheet" href="style.css" />
 </head>
 <body>
 <div class="container">
 <div class="main">
 <h2>PHP Multi Page Form</h2><hr/>
 <span id="error">
 <?php
 if (!empty($_SESSION['error_page3'])) {
 echo $_SESSION['error_page3'];
 unset($_SESSION['error_page3']);
 }
 ?>
 </span>
 <form action="page4_insertdata.php" method="post">
 <b>Complete Address :</b>
 <label>Address Line1 :<span>*</span></label>
 <input name="address1" id="address1" type="text" size="30" required>
 <label>Address Line2 :</label>
 <input name="address2" id="address2" type="text" size="50">
 <label>City :<span>*</span></label>
 <input name="city" id="city" type="text" size="25" required>
 <label>Pin Code :<span>*</span></label>
 <input name="pin" id="pin" type="text" size="10" required>
 <label>State :<span>*</span></label>
 <input name="state" id="state" type="text" size="30" required>
 <input type="reset" value="Reset" />
 <input name="submit" type="submit" value="Submit" />
 </form>
 </div> 
 </div>
 </body>
</html>

PHP file: page4_form.php
Here, we collects values of all pages and store them in database.

<!DOCTYPE HTML>
<html>
 <head>
 <title>PHP Multi Page Form</title>
 <link rel="stylesheet" href="style.css" />
 </head>
 <body>
 <div class="container">
 <div class="main">
 <h2>PHP Multi Page Form</h2>
 <?php
 session_start();
 if (isset($_POST['state'])) {
 if (!empty($_SESSION['post'])){
 if (empty($_POST['address1'])
 || empty($_POST['city'])
 || empty($_POST['pin'])
 || empty($_POST['state'])){ 
 // Setting error for page 3.
 $_SESSION['error_page3'] = "Mandatory field(s) are missing, Please fill it again";
 header("location: page3_form.php"); // Redirecting to third page.
 } else {
 foreach ($_POST as $key => $value) {
 $_SESSION['post'][$key] = $value;
 } 
 extract($_SESSION['post']); // Function to extract array.
 $connection = mysql_connect("localhost", "root", "");
 $db = mysql_select_db("phpmultipage", $connection); // Storing values in database.
 $query = mysql_query("insert into detail (name,email,contact,password,religion,nationality,gender,qualification,experience,address1,address2,city,pin,state) values('$name','$email','$contact','$password','$religion','$nationality','$gender','$qualification','$experience','$address1','$address2','$city','$pin','$state')", $connection);
 if ($query) {
 echo '<p><span id="success">Form Submitted successfully..!!</span></p>';
 } else {
 echo '<p><span>Form Submission Failed..!!</span></p>';
 } 
 unset($_SESSION['post']); // Destroying session.
 }
 } else {
 header("location: page1_form.php"); // Redirecting to first page.
 }
 } else {
 header("location: page1_form.php"); // Redirecting to first page.
 }
 ?>
 </div>
 </div>
 </body>
</html>

CREATE TABLE detail(
   user_id int(10) NOT NULL AUTO_INCREMENT,
   name varchar(255) NOT NULL,
   email varchar(255) NOT NULL,
   contact int(15) NOT NULL,
   password varchar(255) NOT NULL,
   religion varchar(255) NOT NULL,
   nationality varchar(255) NOT NULL,
   gender varchar(255) NOT NULL,
   qualification varchar(255) NOT NULL,
   experience varchar(255) NOT NULL,
   address1 varchar(255) NOT NULL,
   address2 varchar(255) NOT NULL,
   city varchar(255) NOT NULL,
   pin int(10) NOT NULL,
   state varchar(255) NOT NULL,
   PRIMARY KEY(user_id)
)

Styling HTML elements.

@import url(http: //fonts.googleapis.com/css?family=Raleway);
      div.container {
         width: 960 px;
         height: 610 px;
         margin: 50 px auto;
      }
      div.main {
         width: 308 px;
         margin - top: 35 px;
         float: left;
         border - radius: 5 px;
         Border: 2 px solid #999900;
 padding:0px 50px 20px;
 font-family: 'Raleway', sans-serif;
}
# error {
            display: block;
            margin - top: 10 px;
            margin - bottom: 10 px;
         }
         #success {
            color: green;
            font - weight: bold;
         }
         span {
            color: red;
         }
         h2 {
            background - color: #FEFFED;
            padding: 32 px;
            margin: 0 - 50 px;
            text - align: center;
            border - radius: 5 px 5 px 0 0;
         }
         b {
            font - size: 18 px;
            display: block;
            color: #555;
}
hr{
margin: 0 -50px;
border: 0;
border-bottom: 1px solid # ccc;
            margin - bottom: 25 px;
         }
         label {
            color: #464646;
font-size: 14px;
font-weight: bold;
}
input[type= text],
         input[type = password],
         input[type = number],
         input[type = email] {
            width: 96 % ;
            height: 25 px;
            padding: 5 px;
            margin - top: 5 px;
            margin - bottom: 15 px;
         }
         input[type = radio] {
            margin: 20 px;
         }
         select {
            margin - bottom: 15 px;
            margin - top: 5 px;
            width: 100 % ;
            height: 35 px;
            font - size: 16 px;
            font - family: cursive;
         }
         input[type = submit],
         input[type = reset] {
            padding: 10 px;
            background: linear - gradient(#ffbc00 5 % , #ffdd7f 100 % );
            border: 1 px solid #e5a900;
            color: #524f49;
cursor: pointer;
width: 49.2%;
border-radius: 2px;
margin-bottom: 15px;
font-weight:bold;
font-size:16px;
}
input[type= submit]: hover,
         input[type = reset]: hover {
            background: linear - gradient(#ffdd7f 5 % , #ffbc00 100 % );
         }
load more v
65%

< ? php
if (isset($_POST['publish'])) {
   # Publish - button was clicked
}
elseif(isset($_POST['save'])) {
      # Save - button was clicked
   } ?
   >
75%

Get the list of all files in a directory in Node.js ,Awesome!! I want to ask, what if I want to insert data on first button click ( which is on the first page ) and then update the database with new fields on the rest forms.,The form validation part is simple straight forward. Within “rules” section you have to set different properties for each field. Within the “message” section you can set the custom message for each property defined in “rules” section.,Form1 receives the Name, Email and Mobile number from the user and transmits it to the next form. But before sending, it does the form validation.

JS Libraries

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jQuery.Validate/1.6/jQuery.Validate.min.js"></script>
load more v

Other "upload-undefined" queries related to "Php - multi-step form with file upload"