Execute simple mysqli query on click with AJAX

Question

My AJAX/Java knowledge is very limited so this might sound like a stupid and very easy question, but here I go.

I am trying to execute a very simple one line mysqli query after clicking a link on a php page. This query has to be executed in the background, so without reloading the page, so I would need AJAX to do that.

EDIT: This is the code I have now.

The PHP page (notes_checked.php) with my query:

if ($user_ok == true) {
        mysqli_query($db_conx, "UPDATE users SET notescheck=now() WHERE username='$log_username' LIMIT 1");} 
 else {
    exit();
}

The Javascript function I execute when clicking:

<script>

function notesChecked() {

  document.getElementById("notbadge").style.background = "#B0B0B0";
  document.getElementById("notbadge").innerHTML = "0";

  $.ajax({
    type: "POST",
    url: 'php_includes/notes_checked.php',
    data: data,//post data
    success: function()
    {
     alert("You just checked your notes!");
    }
});

}


</script>

The link on my main page:

<a onclick="notesChecked()">Checked</a>

So this script sets the counter back at 0 and changes the background color of the span when the user clicks on it. Now I have to execute the mysqli query so this number stays 0 when the user refreshed the page or comes back later.

Anyone who can tell me if there's an easy way to do this? Thanks!

Please read What topics can I ask about and How to ask a good question And the perfect question Oh and also SO is not a free coding service We are more than willing to help with code that you have a probelms with, but we dont write code from a spec — RiggsFolly
– RiggsFolly, Commented Dec 12, 2015 at 16:38
in case you use jquery: $.ajax({ url: "linktomysqlline.php"}); — GlabbichRulz
– GlabbichRulz, Commented Dec 12, 2015 at 16:40

Nour · Accepted Answer · 2019-01-18 09:31:45Z

1

You have to create another php file for the mysql query to execute(Example:- yourquery.php) which will execute in the background.

Then put an AJAX call to the file :

$.ajax({
  type: "POST",
  url: "yourquery.php",
  success: function(response) {
     // show response for success
   }
});

edited Jan 18, 2019 at 9:31

Nour

1431 silver badge15 bronze badges

answered Dec 12, 2015 at 17:05

Shashank

3385 silver badges16 bronze badges

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

4 Comments

Senne Vandenputte Over a year ago

I just edited the question with the code I have now, but it's still not working strange enough

Senne Vandenputte Over a year ago

I am getting no response at all.. The function noteschecked() executes the first two lines, but the other code just won't execute. Where can I possibly see the errors?

Senne Vandenputte Over a year ago

I just looked at the Network tap in Google Chrome after pressing F12 to see if my ajax calls were being made. After clicking the button, I could see the ajax call was made to my php file. Request URL:xxx/php_includes/mark_as_read.php Request Method:POST Status Code:200 OK So what else could be the problem then?

Shashank Over a year ago

You could use beforeSend in the ajax code to check if the ajax is working or not.Just put it before the success. beforeSend: function() { // alert something }.

szymeo · Accepted Answer · 2015-12-12 17:04:12Z

0

Basically, you can write:

HTML

<button class="i-like-trains">DO YOU LIKE TRAINS?</button>

JS

$(document).ready(function(){
  $('.i-like-trains').on('click', function(){
    var name = 'BOB';
    $.ajax({
        type: "POST",
        url: 'myphpdoc.php',
        data: { 'name' : name },
        success: function()
        {
          alert(msg); // alerts the response from myphpdoc.php
        }
    });
  });
});

MYPHPDOC.PHP

<?php
    // create $db_connection //

    $name = $_POST['name']; // post variable has the same name as in the ajax data array

    mysqli_query($db_connection, "UPDATE users SET notescheck = now() WHERE username='$log_username' LIMIT 1");

    echo 'YES, YOU LIKE TRAINS TOO <3'; // example response
?>

hope I helped :-)

answered Dec 12, 2015 at 17:04

community wiki

szymeo

1 Comment

Senne Vandenputte Over a year ago

I tried all of this but it's just not working :( My main php file has <a class="notbutton">Check</a> on it, my php file with mysqli query is the same as you posted and my script too, and it's still not working..

harry · Accepted Answer · 2015-12-12 17:46:06Z

0

$(document).ready(function() {
   $('#buttionid').click(function(){
     postajax();
   });
});

function postajax()
{
//When the button is clicked do this
$.ajax({
    type: "POST",
    url: 'yourlinktomysql.php',
    data: data,//post data
    success: function()
    {
     //do something if the ajax-action is a success
    }
});
}

edited Dec 12, 2015 at 17:46

answered Dec 12, 2015 at 16:53

harry

1,5323 gold badges12 silver badges32 bronze badges

5 Comments

harry Over a year ago

You should have appended it to the question then. What is the error that you are getting? I'mean in your browser console

Senne Vandenputte Over a year ago

I just edited my question with what I have now. I am not getting any error messages, just nothing happens. Even when I put an echo in my php file I want to execute to test it, I get nothing. It looks like it just does not want to execute the php script at all

harry Over a year ago

Is the event getting triggered? Have you checked your js by putting breakpoints

Senne Vandenputte Over a year ago

When I click the button the first few lines of my script execute (changing the color and the html text), it's just the ajax code that does not want to work..

Senne Vandenputte Over a year ago

Still not working. I've put my other lines in the script (document.getElementById("notbadge").style.background = "#B0B0B0";) and they execute without problems, only the ajax does not want to work. I've noticed it in another php script I have too that it does not want to work. So strange

Collectives™ on Stack Overflow

Execute simple mysqli query on click with AJAX

3 Answers 3

4 Comments

1 Comment

5 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

4 Comments

1 Comment

5 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related