Pass data to database using javascript Onclick

Question

I am a real noob when it comes to javascript/ajax, so any help will be very appreciated. In reference to this question:

Updating a MySql database using PHP via an o

Answer 1

What you would do is on the php server side have a page lets say its update.php. This page will be visited by your javascript in an Ajax request, take the request and put it in a database.

The php might look something like this:

<?php
mysql_connect(...)
mysql_query("INSERT INTO table 
(score) VALUES('$_GET["score"]') ") 

Your javascript would simply preform an ajax request on update.php and send it the variables as get value "score".

Answer 2

The simplest example I can think of is this. Make your AJAX call in your if block like this:

$.get('updatescore.php', {'score': '222'}, function(d) {
    alert('Hello from PHP: ' + d);
});

On your "updatescore.php" script, just do that: update the score. And return a plain text stating wether the update operation was successful or not.

Good luck.

P.S.: You could also use POST instead of GET.

Answer 3

Phil is not passing any values to the script. He's simply sending a request to the script which most likely contains logic to 'update' the score. A savvy person taking his test though could simply look at the HTML source and see the answer by checking to see what the anchor is doing.

To further nitpick about his solution, a set of radio buttons should be used, and within the form, a button or some sort of clickable element should be used to send the values to the server via an ajax request, and the values sent to the server can be analyzed and the status of the answer sent back to the page.

Since you're using jQuery, the code can be made unobtrusive as seen in the following example:

$('#submit_answer').click(function() {
    var answer = 'blah' // With blah being the value of the radio button
    $.get('updatescore.php',
    {'value': answer},
    function(d) {
        alert('Your answer is: ' + d') // Where d is the string 'incorrect' or 'correct'
    }
});

Enjoy.