Passing two variables via AJAX/PHP?

Question

EDITED with UPDATED CODE: Im missing something here; the jQuery is working, but the variables arent passing to the query. Below is all of the updated code:

<span class="accepted"><a href="#" class="accept" id="<?php echo $id1; ?>" data-order="<?php echo $name; ?>"><input type="button" title="accept" value="Accept" /></a></span>

AJAX Script

<script type="text/javascript">
$(function() {
$(".accept").click(function(){
var element = $(this);
var del_id = element.attr("id");
var order_id = element.attr("data-order");

//if(confirm("Are you sure you want to delete this?"))
//{

     $.ajax({
       type: "POST",
       url: "accept.php",
       //data: info,
       data: {id:del_id,order_id:order_id},
       success: function(){}
    //
    });
      $(this).parents(".show").animate({ backgroundColor: "#003" }, "slow")
      .animate({ opacity: "hide" }, "slow");
     //}
    //return false;
    });
    });
    </script>

new php file

include('db.php');
$id = $_POST['id'] ;
$name = $_POST['order_id'] ;
$sql = "UPDATE mgap_orders SET mgap_status = 1 WHERE mgap_ska_id = :id AND mgap_ska_report_category = :name"; 
$stmt = $pdo->prepare($sql); 

$stmt->execute(array(
':id' => '$id',
':name' => '$name'
));

Answer 1

Instead of using var info = 'id=' + del_id; and data: info, You should send variables like below:

data: {id:del_id}

Future more, if you want to pass more variables you can go like below:

data: {id:del_id,order:ORDER_ID}

Hope this helps.

Answer 2

do like this

$.ajax({
   type: "POST",
   url: "delete.php",
   data: {id:del_id,order:order_variable},
   success: function(){
 }

Answer 3

Specify your Data as an object. Should be separated by comma for each variable.

data: {variablename1: value1, variablename2: value2}

So you code should look like:

<script type="text/javascript">
$(function() {
$(".delete").click(function(){
var element = $(this);
var del_id = element.attr("id");
//var info = 'id=' + del_id;
if(confirm("Are you sure you want to delete this?"))
{
 $.ajax({
   type: "POST",
   url: "delete.php",
   data: { id: del_id, var2: var2, var3: var3 },
   success: function(){
 }
});
  $(this).parents(".show").animate({ backgroundColor: "#003" }, "slow")
  .animate({ opacity: "hide" }, "slow");
 }
return false;
});
});
</script>

Answer 4

<script type="text/javascript">
$(function() {
$(".delete").click(function(){
var element = $(this);
var del_id = element.attr("data-id");
var order_id = element.attr("data-order");
var info = 'id=' + del_id;
var order = 'order' + order_id;
if(confirm("Are you sure you want to delete this?"))
{
 $.ajax({
   type: "POST",
   url: "mod_accept.php", //Changed the processor file
   data: {info, order},
   success: function(){
 }
});
  $(this).parents(".show").animate({ backgroundColor: "#003" }, "slow")
  .animate({ opacity: "hide" }, "slow");
 }
return false;
});
});
</script>

Then in your html:

<span class="accepted"><a href="#" class="accept" data-id="<?php echo $id1; ?>" data-order="<?php echo $someVariable ?>"><input type="button" title="accept" value="Accept" /></a></span>

Answer 5

do something like

    <span class="accepted">
          <a href="#" class="delete" id="<?php echo $id1; ?>" 
data-order="<?php echo $order_id;?>">
<input type="button" title="accept" value="Accept" /></a>
      </span>


<script type="text/javascript">
$(function() {
    $(".delete").click(function(){
    var element = $(this);
    var del_id = element.attr("id");
    var order_id = element.attr("data-order");
    if(confirm("Are you sure you want to delete this?"))
    {
     $.ajax({
       type: "POST",
       url: "delete.php",
       data: {id:del_id,order_id:order_id},
       success: function(){
     }
    });
      $(this).parents(".show").animate({ backgroundColor: "#003" }, "slow")
      .animate({ opacity: "hide" }, "slow");
     }
    return false;
    });
});
</script>