PHP 7 Script to Build a Contact Form Using HTML5 and MySQL Database Full Project For Beginners

  • Post author:
  • Post category:PHP
  • Post comments:0 Comments

 

Welcome folks today in this blog post we will be building a contact form using html5 and mysql database using php 7. All the full source code of the application is shown below.

 

 

 

Get Started

 

 

 

In order to get started you need to make an index.html file and copy paste the following code

 

 

index.html

 

 

 

<html>
<head>
<link rel="stylesheet" href="style.css" type="text/css" media="all" />
</head>
<body>
<h2>Contact Us</h2>
  
  <form class="form" action="contactform.php" method="POST">
    
    <p class="username">
      <input type="text" name="name" id="name" placeholder="Enter your name" >
      <label for="name">Name</label>
    </p>
    
    <p class="useremail">
      <input type="text" name="email" id="email" placeholder="mail@example.com" >
      <label for="email">Email</label>
    </p>
    
    <p class="usercontact">
      <input type="text" name="contact" id="contact" placeholder="contact no." >
      <label for="contact">Phone number</label>
    </p>    
  
    <p class="usertext">
      <textarea name="text" placeholder="Write something to us" ></textarea>
                        <label for="text">Comments</label>
    </p>
    
    <p class="usersubmit">
      <input type="submit" name="submit" value="Send" >
    </p>
  </form>
</body>
</html>

 

See also  PHP 7 Script to Get Website Visitor Location,IP Address,Country and City Using Freegeoip and ipstack API Full Project For Beginners

 

And now make a style.css file and copy paste the following code

 

 

style.css

 

 

body {
  padding: 50px 500px;
  font-size: 13px;
    background-color: deepskyblue;
}

h2 {
  margin-bottom: 20px;
  font-family: fantasy;
    font-size: 40px;
}



input, textarea {
  padding: 10px;
  border: 1px solid #E5E5E5;
  width: 200px;
  color: #999999;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 8px;
      
}

textarea {
  width: 200px;
  height: 150px;
  max-width: 400px;
  line-height: 18px;
}

input:hover, textarea:hover,
input:focus, textarea:focus {
  border-color: 1px solid #C9C9C9;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 8px;  
}

.form label {
  margin-left: 10px;
  font-family:monospace;
    font-size: 15px;
}


.usersubmit input {
  width: 100px; 
  height: 40px;
  background-color: #474E69; 
  color: #FFF;
  border-radius: 3px;
    
}

 

 

 

And now make a contactform.php file and copy paste the following code

See also  PHP 7 TCPDF Tutorial to Set Page Size, Orientation & Format inside PDF Document in Browser Full Project For Beginners

 

 

contactform.php

 

 

<?php 
  //creating connection to database
$con=mysqli_connect("localhost","root","","codespeedy") or die(mysqli_error());

  //check whether submit button is pressed or not
if((isset($_POST['submit'])))
{
  //fetching and storing the form data in variables
$Name = $con->real_escape_string($_POST['name']);
$Email = $con->real_escape_string($_POST['email']);
$Phone = $con->real_escape_string($_POST['contact']);
$comments = $con->real_escape_string($_POST['text']);

  //query to insert the variable data into the database
$sql="INSERT INTO contactus (name, email, phone, comments) VALUES ('".$Name."','".$Email."', '".$Phone."', '".$comments."')";

  //Execute the query and returning a message
if(!$result = $con->query($sql)){
die('Error occured [' . $conn->error . ']');
}
else
   echo "Thank you! We will get in touch with you soon";
}

?>

Leave a Reply