I have this droppable AJAX code which works fine like this. Note the specific values in the data line (1227 and 46.0), which I only did for testing purposes:
$( function() {
$( ".draggable" ).draggable();
$( ".droppable" ).droppable({
drop: function( event, ui ) {
var playerid = ui.draggable[0].getAttribute("data-playerid");
var value = jQuery(this).data('value');
console.log(playerid);
console.log(value);
$( this )
.addClass( "ui-state-highlight" )
.find( "p" )
.html( "Dropped!" );
$.ajax({
type: "POST",
url: "ajax-update-value.php",
data: { data : 1227, data2: 46.0 },
success: function(result) {
// do something with the result of the AJAX call here
alert(result);
}
});
}
});
});
What I WANT to do is use the actual variables that were set in the drop function towards the top but when I change it so variables are there instead of actual values (only change is in the data line), the console gives a POST error (500 internal server error):
$( function() {
$( ".draggable" ).draggable();
$( ".droppable" ).droppable({
drop: function( event, ui ) {
var playerid = ui.draggable[0].getAttribute("data-playerid");
var value = jQuery(this).data('value');
console.log(playerid);
console.log(value);
$( this )
.addClass( "ui-state-highlight" )
.find( "p" )
.html( "Dropped!" );
$.ajax({
type: "POST",
url: "ajax-update-value.php",
data: { data : playerid, data2: value},
success: function(result) {
// do something with the result of the AJAX call here
alert(result);
}
});
}
});
});
FWIW, here is how I’m processing those two pieces of data in the PHP file. I only have print_r($_POST) for testing purposes:
$playerid=$_POST['data'];
$value=$_POST['data2'];
$stmt = $pdo->prepare("UPDATE players SET value=:value WHERE playerid=:playerid");
$stmt->execute([':value' => $value, ':playerid' => $playerid]);
print_r($_POST);