Use AJAX/PHP to have an HTML button insert data into a MySQL database

Question

My goal is when I click a button on this webpage, there will be data entered into the MySQL database.

On the .html page:

<html>
<body>
<p id="output">Output here</p>
  <!-- Primary Page Layout
  –––––––––––––––––––––––––––––––––––––––––––––––––– -->
  <div class="container" style="background-image: url(images/background.png); width: 640px; height: 1400px; ">
    <div class="row">
      <div class="one-half column" style="margin-top: 25%">
          <button onclick="submitFunction()" style="width: 150px; height: 100px; position: absolute; left: 70px; top: 880px;">test</button>
      </div>
    </div>
  </div>

<!-- Scripts-->
<script>
function submitFunction() {
   $.ajax({
        url: 'sendcheck.php',
        type: 'post',
        data: {'Test1': 'data1', 'Test2': 'data2', 'Test3': 'data3', 'Test4': 'data4', 'Test5': 'data5'},
        success: function(data, status) {
          if(data == "ok") {
            document.getElementById("output").innerHTML = "Data sent";
          }
        },
        error: function(xhr, desc, err) {
          console.log(xhr);
          console.log("Details: " + desc + "\nError:" + err);
        }
      }); // end ajax call
}
</script>

<!-- End Document
  –––––––––––––––––––––––––––––––––––––––––––––––––– -->
</body>
</html>

The "sendcheck.php" page here:

<?php


$db = "testBase";
$dbu = "root";
$dbp = "test_test";
$host = "localhost";

$dblink = mysql_connect($host,$dbu,$dbp);
$seldb = mysql_select_db($db);

if(isset($_GET['Test1']) && isset($_GET['Test2']) && isset($_GET['Test3']) && isset($_GET['Test4']) && isset($_GET['Test5'])){

     $Test1 = strip_tags(mysql_real_escape_string($_GET['Test1']));
     $Test2 = strip_tags(mysql_real_escape_string($_GET['Test2']));
     $Test3 = strip_tags(mysql_real_escape_string($_GET['Test3']));
     $Test4 = strip_tags(mysql_real_escape_string($_GET['Test4']));
     $Test5 = strip_tags(mysql_real_escape_string($_GET['Test5']));
     $sql = mysql_query("INSERT INTO `$db`.`tester_table` (`ID,`Test1`,`Test2`,`Test3`,`Test4`,`Test5`) VALUES ('','$Test1','$Test2','$Test3','$Test4','$Test5');");
     
     if($sql){
     
          echo 'Your data was submitted';
          
     }else{
       
          echo 'There was a problem. Please try again later.';
          
     }
     
}else{
     echo 'Your test wasnt passed in the request. Make sure you add ?Test1=data1_HERE&Test2=data2_here&Test3=data3_here&Test4=data4_here&Test5=data5_here to the tags.';
}

mysql_close($dblink);//Close off the MySQL connection to save resources.
?>

I have been stumped on this for a couple of days. When I hit the button, nothing happens. Am I even on the right track? Or is there possibly an easier way of doing what I'm trying to accomplish.

Have the data been successfully inserted in your database or are you having a problem trying to change the innerHTML of #output? — kidA
– kidA, Commented Mar 1, 2015 at 2:39
The data will not insert into the database, that is the problem. — tyler5819
– tyler5819, Commented Mar 1, 2015 at 2:50

Patrick Sava · Accepted Answer · 2015-03-01 02:39:48Z

1

You are doing a post with Ajax and in the php you are using $_GET to read the variables. You should use $_POST instead of $_GET.

answered Mar 1, 2015 at 2:39

Patrick Sava

1264 bronze badges

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

5 Comments

tyler5819 Over a year ago

I changed the $_GET's in the PHP code to $_POST's and that doesn't seem to fix it, the code still won't post any data to the database.

Patrick Sava Over a year ago

I also see that it's missing a ` after ID in the query, have you tried executing that query directly on Mysql to see if the SQL syntax is correct? The PHP and the Ajax seems to be ok now.

tyler5819 Over a year ago

Alright I fixed the ` but when running this query directly: "INSERT INTO $db.tester_table (ID,Test1,Test2,Test3,Test4,Test5) VALUES ('','$Test1','$Test2','$Test3','$Test4','$Test5');" It outputs: #1062 - Duplicate entry '0' for key 'PRIMARY'

jperezov Over a year ago

@tyler5819 Why don't you just try using INSERT IGNORE instead of just INSERT. Additionally, do you have an auto-increment set on your primary key (assuming that's the behavior you're expecting)?

tyler5819 Over a year ago

So each time an entry is entered into the database, it is assigned a unique ID.

Collectives™ on Stack Overflow

Use AJAX/PHP to have an HTML button insert data into a MySQL database

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related