Multi step registration form in PHP

Multi Step Responsive Form Using PHP JavaScript and HTML


In this blog we are going to create a simple registration form with multiple steps. In this example we used simple JavaScript functions and HTML with CSS. So for creating  multistep form applications using PHP here I provided some points to follow. Please check out the code example and requirements for building multistep form in PHP

 

Database:

 Menu👆 Top

 Create Database and Table with given MySQL Code

 
  Database: coding-zon
 

 
  Table structure for table register
 

CREATE TABLE IF NOT EXISTS register (
  id int(11) NOT NULL AUTO_INCREMENT,
  fname  varchar(30) NOT NULL,
  lname  varchar(30) NOT NULL,
  username  varchar(30) NOT NULL,
  password  varchar(150) NOT NULL,
  email  varchar(30) NOT NULL,
  phone  varchar(30) NOT NULL,
  birthdate  varchar(30) NOT NULL,
  PRIMARY KEY (id)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=1 ;


etrainings-multi-step-form-mysql-table

 MenuTop

Folder structure:

 In this application we are using only 2 files.

  • index.php
  • action-page.php


coding-zon-multistep-form-project-structure
 

So, let’s walk through the steps on how to create a multistep form in PHP.

STEP-1. Create one folder in Server.     

STEP-2. Create Index.php. Next go to given link, copy the code and paste in index.php.

               Get the form code from Here.

STEP-3. Create action-page.php  with code given below.

action-page.php

 MoveTop

<!DOCTYPE html>
<html>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet">
<body>

<?php
	
	
	define('DB_SERVER','localhost');
	define('DB_USER','root');
	define('DB_PASS','');
	define('DB_NAME', 'coding-zon');
	
	$con = mysqli_connect(DB_SERVER, DB_USER, DB_PASS, DB_NAME);
	
		
	$fname = $_POST["fname"];
	$lname = $_POST["lname"];
	$uname = $_POST["uname"];
	$password = $_POST["pword"];
	$email = $_POST["email"];
	$phone = $_POST["phone"];
	$date = $_POST["dd"]."-".$_POST["mm"]."-".$_POST["yyyy"];
	
	
	
	
	$query = "insert into register(fname,lname,username,password,email,phone,birthdate)
	values('$fname','$lname','$uname','$password','$email','$phone','$date')";

	$result=mysqli_query($con,$query );

	if($result){
	?>
	<div id="regForm"><span class="success"></span><h1>Registration Success</h1></div>
	
	<?php
	}
	else{
	?>
	
	<div class="regForm"><h1>Oops!! Something went wrong.</h1></div>
	<?php
	}
	
?>

<style>
	* {
  box-sizing: border-box;
}

body {
  background-color: #f1f1f1;
}

#regForm {
  background-color: #ffffff;
  margin: 100px auto;
  font-family: Raleway;
  padding: 40px;
  width: 50%;
  min-width: 300px;
}

h1 {
  text-align: center;  
}
.success {

      height: 25px;
      width: 12px;
      margin-left: 50%; 
	  display: inline-block;
      transform: rotate(45deg);
      border-bottom: 7px solid #78b13f;
      border-right: 7px solid #78b13f;
    }
 

</style>

 


</body>
</html>

 

 

STEP-4. Open index.php in Browser.



Source

Demo:



 

 

Comments

Popular posts from this blog

Recently viewed list in PHP Mysql

Import CSV File Into MySQL Using PHP

Shoppingcart using PHP Sessions - Miniproject