Home >> PHP MySql Ajax >> Contact Us Form Submit in PHP MySql Ajax

Contact Us Form Submit in PHP MySql Ajax

Following steps to Contact Us Form Submit using PHP MySQL using Ajax:
Step 1: Create Contactus table.
Step 2: Create DB Connection.
Step 3: Create Html Form For Display Contact Us Form.
Step 4: Save data by contact us form.
Step 1:
Run the following sql query to create database and table:
CREATE TABLE `contactus` (
 `name` varchar(50) COLLATE utf8_unicode_ci NOT NULL,
 `email` varchar(150) COLLATE utf8_unicode_ci NOT NULL,
 `mobile` varchar(20) COLLATE utf8_unicode_ci NOT NULL,
 `message` varchar(250) COLLATE utf8_unicode_ci NOT NULL,
 `status` tinyint(1) NOT NULL DEFAULT '1' COMMENT '1=Active | 0=Inactive',
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;
Step 2:
Create database connection file named dbconnection.php
     $dbname = "education";
         die('Could not Connect MySql Server:' .mysql_error());
Step 3:
Create Html Form For Display Contact Us Form.
<!doctype html>  
<form action="" id="contactForm" method="POST" onsubmit="return false">  
      <div id="resultMessage"></div>     
      <div class="form-group">
         <label for="Name">Name</label>
         <input type="text" name="name" id="name" class="form-control">   
      <div class="form-group">
         <label for="Name">Email</label>
         <input type="text" name="email" id="email" class="form-control">   
      <div class="form-group">
         <label for="Name">Mobile No.</label>
         <input type="text" name="mobile" id="mobile" class="form-control">   
      <div class="form-group">
         <label for="Name">Message</label>
         <input type="text" name="message" id="message" class="form-control">   
      <div class="form-group">
         <input type="submit" name="submit" id="submit" value="Submit" class="form-control">   
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
    $('#contactForm').on('submit', function() {
       var name = $('#name').val();
       var email = $('#email').val();
       var mobile = $('#mobile').val();
       var message = $('#message').val();
           type: 'POST',
           url: "save-contact-us.php",
           dataType: 'html',
           data: "name="+name+"&email="+email+"&mobile="+mobile+"&message="+message,
           success: function(response) {
               if (response == "yes") {
                   $('#resultMessage').html("Your contact us submit successfully");
               } else if (response == "no") {
                   $('#resultMessage').html("Your contact us not saved");
Step 4: 
Now, Save data by file named save-contact-us.php
      require_once "dbconnection.php";
      $name = $_POST["name"];
      $email = $_POST["email"];
      $mobile = $_POST["mobile"];
      $message = $_POST["message"];
      $query="insert into contactus(name,email,mobile,message)values('".$name."','".$email."','".$mobile."','".$message."')";
      $result = mysqli_query($conn,$query);
           echo 'yes';
      } else {
            echo 'no';

Comments (1)
  • Rohit Sharma 18/May/2022

    Thanks Coderraj All Team for Provide Good Content.

Post Your Comment

Next Questions
Feedback Form Submit
Comment Form Submit
Register Form Submit
Login Form Submit
Enquiry Form Submit
Subscribe Form Submit
How to Upload File
How to Upload Multiple Files
How to Upload Image
How to Upload Multiple Image
Image Crop and Save into Database

Copyright ©2022 coderraj.com. All Rights Reserved.