how to insert data in databse without page reload?

Question

i want to insert data without page reload. here is the html form i have used. taskinsert.php is the php file which i have used.

`<form class="form-horizontal" id="form_post" enctype="multipart/form-data">
          <div class="row">

        <div class="form-group col-md-12">
          <label class="col-sm-2" for="uploadedimage">Image :</label>
          <div class="col-sm-7">
            <input type="file" class="btn btn-primary" name="uploadedimage" id="uploadedimage">
          </div> <div class="col-sm-3"></div>
        </div>

        <div class="form-group col-md-12">
          <label class="col-sm-2" for="email">Email :</label>
          <div class="col-sm-7">
            <input type="text" class="" name="email" id="email">
          </div> <div class="col-sm-3"></div>
        </div>

        <div class="form-group col-md-12">
          <label class="col-sm-2" for="phone">Phone :</label>
          <div class="col-sm-7">
            <input type="text" class="" name="phone" id="phone">
          </div> <div class="col-sm-3"></div>
        </div>

        <div class="form-group col-md-12">
          <div class="col-sm-offset-2 col-sm-10">
            <input type="submit" class="btn btn-success" name="gk" id="gk" value="submit">
          </div>
        </div>


        </div>
</form>`

how to insert data in database without page reload? I have tried this , any ideas? below is the script i have used. I think the problem is in the script.

`<script> 
    $("#gk").click(function(){
                $("form#form_post").submit(function(event){
                    event.preventDefault();
                      var formData = new FormData($(this)[0]);
                     $.ajax({
                        url: 'taskinsert.php',
                        type: 'POST',
                        contentType: false,
                        processData: false,
                        success: function (response) {
                            $('#success').html(response);
                    var form=document.getElementById('form_post').reset();
                                  return false;
                          }
                    });
                  }); 
            }); 
</script>`

use `ajax` call to the API that will save the data to database — Ankit Agarwal, Apr 24 '18 at 11:00
You are not even using your `formData`. With the information given there is not very much to say. Mabye you're looking for the missing `return false` in the `click` event listener — miile7, Apr 24 '18 at 11:03
https://stackoverflow.com/questions/20769364/insert-data-through-ajax-into-mysql-database?answertab=oldest#tab-top — Gopi Chand, Apr 24 '18 at 11:04
Possible duplicate of [Insert data through ajax into mysql database](https://stackoverflow.com/questions/20769364/insert-data-through-ajax-into-mysql-database) — Himanshu Upadhyay, Apr 24 '18 at 11:05

score 0 · Answer 1 · answered Apr 24 '18 at 12:02

java script :

 $(document).on('click','#save',function(e) {
  var data = $("#form-search").serialize();
  $.ajax({
         data: data,
         type: "post",
         url: "send.php",
         success: function(data){
              alert("Data Save: " + data);
         }
});
 });

your save php file send.php:

<?php 
if(isset($_REQUEST))
{
        mysql_connect("localhost","root","");
mysql_select_db("eciticket_db");
error_reporting(E_ALL && ~E_NOTICE);

$email=$_POST['email'];
$sql="INSERT INTO newsletter_email(email) VALUES ('$email')";
$result=mysql_query($sql);
if($result){
echo "You have been successfully subscribed.";
}
}
?>

how to insert data in databse without page reload?

1 Answers1