通过AJAX将JQuery变量传递给Php

Am passing a variable to JQuery via the data-pid in a href link in payments.php and using AJAX to pass this variable to pmntPopup.php, however the variable is not being passed on

payments.php

<td class="listingTextLeft">
<a href="" data-pid="<?php echo $row[0] ?>" class="pmntDetail"><?php echo $row[20] ?></a>
</td>
<script>
        $( ".pmntDetail" ).click(function( paymentID ) {
            paymentID.preventDefault();
            paymentID.stopPropagation();
            var pmntid = $(this).data("pid");
            console.log("ID: ", pmntid);
            $.ajax({
                type: "POST",
                url: "pmntPopup.php",
                data: {pmntid : pmntid },
                success:function(data) {
                    console.log(pmntid);
                    $("#pmntDetailPopup").modal({position: ["5%"]});
                }
            });
        });
</script>

The console log in both instances show the correct value for pmntid but when when trying to use POST to retrieve it in pmntPopup.php below I just get the 'Payment Is Not Carried' message.

pmntPopup.php

<?php
    if(isset($_POST['pmntid'])) {
        $pmntid = $_POST['pmntid'];
    } else {
        echo "Payment Is Not Carried";
    }
?>

I've searched this site and from what I can tell this should work, I've probably missed something really basic or doing something really stupid ... or both.

Console POST output:

Hi @Jay, have already posted a picture of the POST output from the console above, the picture below shows the Popup window output if that's any help:

As requested the console response output is shown below:

I'm not sure what you're doing with the paymentID variable, but this should work for you:

$( ".pmntDetail" ).click(function( ) {
    var pmntid = $(this).data("pid");
    console.log("ID: ", pmntid);
    $.ajax({ ...

Try this, the response of the ajax call will be set to data variable of your success callback function.

payments.php

<td class="listingTextLeft">
<a href="#" data-pid="<?php echo $row[0] ?>" class="pmntDetail"><?php echo $row[20] ?></a>
</td>
<script>
        $( ".pmntDetail" ).click(function( event ) {
            event.preventDefault();
            var pmntid = $(this).data("pid");
            console.log("ID: ", pmntid);
            $.ajax({
                type: "POST",
                url: "/UCM/pmntPopup.php",
                data: {pmntid : pmntid },
                success:function(data) {
                    console.log(data); // YOU WILL RECEIVE THE RESPONSE IN data variable.
                    $("#pmntDetailPopup").modal({position: ["5%"]});
                }
            });
        });
</script>

pmntPopup.php

<?php
    if(isset($_POST['pmntid'])) {
        echo $_POST['pmntid'];
    } else {
        echo "Payment Is Not Carried";
    }
?>

[Also, I have put the complete url of the file, ie., "/UCM/pmntPopup.php" to your ajax url param]

Try this instead.

<td class="listingTextLeft">
<a href="" data-pid="<?php echo $row[0] ?>" class="pmntDetail"><?php echo $row[20] ?></a>
</td>
<script type="text/javascript">
$( ".pmntDetail" ).click(function(e) {
e.preventDefault();
var pmntid = $(this).data("pid");
console.log("ID: ", pmntid);
var request = $.ajax({
url: "pmntPopup.php",
type: "POST",
data: {pmntid : pmntid},
dataType: "html"
});
request.done(function(msg) {
console.log( msg );
});
request.fail(function(jqXHR, textStatus) {
alert( "Connection error: " + textStatus );
});
});
</script>

pmntPopup.php

<?php
    if(isset($_POST['pmntid'])) {
        $pmntid = $_POST['pmntid'];
         echo $pmntid;
    } else {
        echo "Payment Is Not Carried";
    }
?>

As an alternative solution try jQuery post

$.post( "pmntPopup.php", {pmntid : pmntid})
.done(function( data ) {
alert( "Data Loaded: " + data );
});