jquery Ajax POST posted but not received?

Question

I am completely confused:

This is my php script "add_credits.php". It runs perfectly if I create a form and call it via method="post".

$stmt = "UPDATE sites SET credits=:credits WHERE id=:id";
$stmt = $db->prepare($stmt);
$stmt ->execute( array( ":credits" => $_POST['cred'], ":id" => $_POST['id'] ) );

This is my input field that triggers the jquery/ajax.

<input id="<?php echo $row['id']; ?>" type="text" class="credits" value="<?php echo $row['credits']; ?>" />

This is my jquery, which will echo eitther variable in an alert box correctly on success.

$(".credits").bind('input', function() {
            var add_id = $(this).attr("id");
            var info = 'id=' + add_id;                
            var add_cred = $(this).attr("value");
            var info2 = 'cred=' + add_cred;
                $.ajax({
                    type : "POST",
                    url : "add_credits.php", //add credits on enter php script
                    data : {info:info, info2:info2},
                    success : function() {
                       alert(info2);
                    }
                });
            return true;
});

So why is it that its reporting success, yet no UPDATE is being performed, as if the php is not receiving the $_POST details? Am I missing something??

Answer 1

You don't have to manually serialize the data like that

$('.credits').on('input', function() {
  var req = $.post('add_credits.php', {
    info: $(this).attr('id'),
    info2: $(this).attr('value')
  });
  req.done(function(res) {
    console.log(res);
  });
  req.fail(function(err) {
    console.error(err);
  });
});

On the PHP side of things, make sure you're reading info and info2

// info and info2 were set in the POST request in the jQuery above
$info = $_POST['info'];
$info2 = $_POST['info2'];

do_something($info, $info2);

// respond in some way
header('content-type: application/json');
echo json_encode(['ok'=> true]);

---

You can name the fields id and cred if that's what you wish. That would change the jQuery data to this

var req = $.post('url', {
  id: $(this).attr('id'),
  cred: $(this).attr('value')
});

Then make sure you read $_POST['id'] and $_POST['cred'] in the PHP

Answer 2

Use the following jquery code:

 $(".credits").bind('input', function() {
            var add_id = $(this).attr("id");
            var info = add_id;                
            var add_cred = $(this).attr("value");
            var info2 = add_cred;
                $.ajax({
                    type : "POST",
                    url : "add_credits.php", //add credits on enter php script
                    data : {id:info, cred:info2},
                    success : function() {
                       alert(info2);
                    }
                });
            return true;
});