Jquery ajax add to mysql database

Question

I want to save data from input fields to mysql database so first I create a modal window and input fields:

<!-- Button trigger modal -->
<button class="btn btn-success" data-toggle="modal" data-target="#myModal">
Add new</button>
<div id="output"></div>
<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
   <div class="modal-dialog">
      <div class="modal-content">
         <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Add new row</h4>
         </div>
         <div class="modal-body">
            ......
            <div class="input-group">
               <span class="input-group-addon">Ime</span>
               <input type="text" id="Ime" class="form-control" placeholder="Upisi ime">
            </div>
            </br>
            <div class="input-group">
               <span class="input-group-addon">Pol</span>
               <input type="text" id="pol" class="form-control" placeholder="Pol (male/female)">
            </div>
            </br>
            <div class="input-group">
               <span class="input-group-addon">Godine</span>
               <input type="text" id="godine" class="form-control" placeholder="Godine starosti">
            </div>
            </br>
            <div class="input-group">
               <span class="input-group-addon">Broj pojedenih krofni</span>
               <input type="text" id="krofne" class="form-control" placeholder="Pojedene krofne">
            </div>
            </br>
         </div>
         <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button id="newData" class="btn btn-primary">Add new data</button>
         </div>
      </div>
      <!-- /.modal-content -->
   </div>
   <!-- /.modal-dialog -->
</div>
<!-- /.modal -->

Now I write jQuery AJAX code to add data to database:

 <script>
  //add data to database using jquery ajax
$("#newData").click(function() {
    //in here we can do the ajax after validating the field isn't empty.
    if($("#ime").val()!="") {
        $.ajax({
            url: "add.php",
            type: "POST",
            async: true, 
            data: { Name:$("#ime").val(), Gender:$("#pol").val(), Age:$("#godine").val(), Donuts_eaten:$("#krofne").val()}, //your form data to post goes here as a json object
            dataType: "html",

            success: function(data) {
                $('#output').html(data); 
                drawVisualization();   
            },  
        });
    } else {
        //notify the user they need to enter data
    }
});
</script>

and finally I create a php file (add.php)

<?php

$con = mysql_connect('localhost', 'gmaestro_agro', 'pass') or die('Error connecting to server');

mysql_select_db('gmaestro_agro', $con); 

    mysql_select_db('gmaestro_agro', $con);
    $query = "INSERT INTO `stat` (`Name`, `Gender`, `Age`, `Donuts eaten`) VALUES (";
    $query .= mysql_real_escape_string($_POST['Name']) . ", ";
    $query .= mysql_real_escape_string($_POST['Gender']) . ", ";
    $query .= mysql_real_escape_string($_POST['Age']) . ", ";
    $query .= mysql_real_escape_string($_POST['Donuts_eaten']);
    $query .= ")";
    $result = mysql_query($query);
    if($result != false) {
        echo "success!";
    } else {
        echo "an error occured saving your data!";
    }

?>

Now, when I try to add data I just get this error: an error occurred saving your data!.

What is the problem here exactly? I try to find the error whole day...

Have you checked ur server logs to see if there is a clearer error message? — MarkP
– MarkP, Commented Feb 1, 2014 at 14:25
What is table structure, there must be something wrong with table structure or mysql connection, rest evrything is fine — Anubhav
– Anubhav, Commented Feb 1, 2014 at 14:37
Now is all good, becouse my ID names was wrong. Thanks for help — MikiMrki
– MikiMrki, Commented Feb 1, 2014 at 14:41

jeroen · Accepted Answer · 2014-02-01 14:25:02Z

4

You are not quoting your strings:

$query .= mysql_real_escape_string($_POST['Name']) . ", ";

should be:

$query .= "'" . mysql_real_escape_string($_POST['Name']) . "', ";

(for all string values)

By the way, it would probably make your life easier if you switched to PDO or mysqli and prepared statements. Then you would not have to escape and quote your variables and the mysql_* functions are deprecated anyway.

answered Feb 1, 2014 at 14:25

jeroen

91.8k22 gold badges117 silver badges132 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

MikiMrki Over a year ago

I again get error: an error occured saving your data! ,,, example: agrotime.roadvoyage.com/index1.html , try to add data click on button add new

Anubhav · Accepted Answer · 2014-02-01 14:29:49Z

1

      $query = "INSERT INTO `stat` (`Name`, `Gender`, `Age`, `Donuts eaten`) VALUES (";
      $query .= "'".mysql_real_escape_string($_POST['Name']) . "', ";
      $query .= "'".mysql_real_escape_string($_POST['Gender']) . "', ";
      $query .= "'".mysql_real_escape_string($_POST['Age']) . "', ";
      $query .= "'".mysql_real_escape_string($_POST['Donuts_eaten']);
      $query .= "')";

Put all the values in single quotes.

answered Feb 1, 2014 at 14:29

Anubhav

1,6234 gold badges18 silver badges32 bronze badges

Collectives™ on Stack Overflow

Jquery ajax add to mysql database

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related