Home >> PHP MySql Ajax >> Feedback Form Submit in PHP MySql Ajax

Feedback Form Submit in PHP MySql Ajax

Following steps to Feedback Form Submit using PHP MySQL using Ajax:
Step 1: Create Feedback table.
Step 2: Create DB Connection.
Step 3: Create Html Form For Display Feedback Form.
Step 4: Save data by Feedback form.
 
Step 1:
Run the following sql query to create database and table:

CREATE DATABASE education;
 
CREATE TABLE `feedback` (
 `id` int(11) NOT NULL AUTO_INCREMENT,
 `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',
 PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;

Step 2:
Create database connection file named dbconnection.php

<?php
     $dbservername='localhost';
     $dbusername='root';
     $dbpassword='';
     $dbname = "education";
     $conn=mysqli_connect($dbservername,$dbusername,$dbpassword,$dbname);
     if(!$conn){
         die('Could not Connect MySql Server:' .mysql_error());
     }
?>

Step 3:
Create Html Form For Display Feedback Form.

<!doctype html>  
<html>  
<head>  
<title>Feedback Form</title>   
</head>  
<body>  
<h3>Feedback Form</h3>  
<form action="" id="feedbackForm" 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>
      <div class="form-group">
         <label for="Email">Email</label>
         <input type="text" name="email" id="email" class="form-control">   
      </div>
      <div class="form-group">
         <label for="Mobile No.">Mobile No.</label>
         <input type="text" name="mobile" id="mobile" class="form-control">   
      </div>
      <div class="form-group">
         <label for="Message">Message</label>
         <input type="text" name="message" id="message" class="form-control">   
      </div>
      <div class="form-group">
         <input type="submit" name="submit" id="submit" value="Submit" class="form-control">   
      </div>
</form>
<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() {
    $('#feedbackForm').on('submit', function() {
       var name = $('#name').val();
       var email = $('#email').val();
       var mobile = $('#mobile').val();
       var message = $('#message').val();
       $.ajax({
           type: 'POST',
           url: "save-feedback.php",
           dataType: 'html',
           data: "name="+name+"&email="+email+"&mobile="+mobile+"&message="+message,
           success: function(response) {
               if (response == "yes") {
                   $('#resultMessage').html("Your feedback submit successfully");
               } else if (response == "no") {
                   $('#resultMessage').html("Your feedback not saved");
               }
           }
       });
    });
});
</script>  
</body>  
</html> 

Step 4: 
Now, Save data by file named save-feedback.php

<?php
      require_once "dbconnection.php";
      $name = $_POST["name"];
      $email = $_POST["email"];
      $mobile = $_POST["mobile"];
      $message = $_POST["message"];
      $query="insert into feedback(name,email,mobile,message)values('".$name."','".$email."','".$mobile."','".$message."')";
      $result = mysqli_query($conn,$query);
      if($result){
           echo 'yes';
      } else {
            echo 'no';
      }
?>

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

    Thanks a lot This is the complete article for beginners

Post Your Comment

Next Questions
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.