Jquery AJAX post to update database

I'm using the following code in my HTML form - trying to make a sort of "lottery scratch ticket" type effect. There's a grid, each item with a dynamic number from a database. Clicking the square calls the clickme() function, makes the db call, and then changes the image. I'm just on the first part trying to get the database to update.

My PHP/HTML:

    if ($unlock == 0) { 
    echo '<div> class="' . $currentgrid .'" name="' . $slot . '"   
    onclick="clickme();" style="cursor: pointer;">'; 
    } else { echo '<div>'; }

And my javascript.js file:

function clickme()
{
// $(function() {
//    $(".gridsquare").click(function() {

    var slotnumber = $(this).attr('name');
    // var gridnumber = $(this).attr('class');
    var dataString = 'slot='+ slotnumber;
    // + '&gridnumber=' + gridnumber;

     开发者_如何转开发   $.ajax({
            type: "POST",
            url: "post/supergridupdate.php",
            data: dataString,
            success: function(){
                // $('.success').fadeIn(200).show();
                // $('.error').fadeout(400).hide;
            }
        });

    return false;
//    });
// });

}

supergridupdate.php:

    <?php 
     $slot = $_POST['slot']; 
     // $gridnumber = $_POST['gridnumber']; 
     $gridnumber = 1;
     $sql = "INSERT INTO test (slot, gridnumber) VALUES ('$slot', '$gridnumber')";
     $result = mysql_query($sql) or die(mysql_error()); 
     ?> 

Right now it all displays, I can click divs but the database doesn't update.

UPDATE: Got it to work with help, just simply passing the variable in the javascript function now instead of using jquery.

Are you certain that 'slotnumber' has a value? Also have you tried sending an object rather than a string? var dataString = {'slot': slotnumber}; --EDIT in your function try to pass the element to the function onclick="clickme(this);"

function clickme(el)
{
// $(function() {
//    $(".gridsquare").click(function() {

    var slotnumber = $(el).attr('name');
    // var gridnumber = $(this).attr('class');

You have commented // $gridnumber = $_POST['gridnumber']; and you are using it in query not sure if thats causing error.

Add this

success: function(data){
 alert(data);
}

Can you do echo $result or Exception and see if it throws any error ? Also do echo $sql which will alert the query . That way you can see what exactly happened.

Also wrap query execution in try catch to be safe

try{

   $result = mysql_query($sql) or die(mysql_error()); 
} catch (Exception $e) {
    echo 'Caught exception: ',  $e->getMessage(), "\n";
}

Just like that, are you connected to your database on that file "supergridupdate.php" ?

i hope prior to making update in the db you have correctly established the connection

in your supergridupdate.php you are doing

$slot = $_POST['slot']; 

so in your ajax request you need to do

data:{slot:dataString},

HTH

Are you sure that you are generating the html correctly or is it just a typo. You are closing the div tag before attributes. Try this

echo '<div class="' . $currentgrid .'" name="' . $slot . '" onclick="clickme();" style="cursor: pointer;">';