CODEWITHSUNDEEP
phpjqueryajax
bcrypt
bcrypt

Reputation: 56

Getting jQuery variable to PHP in the same file without refreshing the page

Thanks for reading. I have tried the answers in other similar questions but none have worked so far. I'm trying to UPDATE values inside a Table that is inside a form, so in the first part of the file is the isset "saveImport" which is the name of the a tag that I'm using to send the id thru the URL:

if (isset($_POST['saveImport'])) {

    $id = $_POST['id'];
 }

a tag:

<a name="saveImport" href="./?id=<?= $row['id']; ?>" class="saveImport btn btn-success col-xs">Save</a>

I do get the ID value in the URL but since is been updated in the same file I'm assuming it refreshes the page before the variable gets post thru AJAX:

<script type="text/javascript">
  $(document).ready(function() {
     $('.saveImport').click(function() {
         var imp_id = id.id;
         var imp_href = $(id).attr('href');

         alert(imp_href);
         $.ajax({
            url: "./",
            data: {id : imp_id},
            type: "POST",
            success:  function(data){
               alert(id);//send this ID to the PHP variable without 
                         //refreshing the file
            }
         });

    });

  });

I'm getting the class .saveImport because it's inside a Table which is displaying values from a Database so it's inside a while loop and if I use an ID it will cause conflict as the ID will repeat itself.

I already created the PHP function to UPDATE the Values which executes if the ISSET is true, so my real problem will be to execute the ISSET and inside grab the ID that was posted with AJAX so I can use the ID in the UPDATE function. Right now, if I click on the a tag, it sends the ID thru URL, the page refreshes but the value of the ID is not getting in the $id = $_POST['id];

I appreciate your time.

Upvotes: 0

Views: 363

Answers (2)

dpblnt
dpblnt

Reputation: 41

This should work.

Change the ajax url to your php file name (mine was t.php).

Replace 99 with your data from php. (id is used. href is not used)

<?php
if (isset($_POST['saveImport'])) {
    print_r( $_POST );
    exit;
 }
?>

<a name="saveImport" id='99' href="./?id=99" class="saveImport btn btn-success col-xs"'>Save</a>


<script type="text/javascript">
 $('.saveImport').click(function(event) {
     var imp_id = this.id;
     $.ajax({
        url: "t.php",
        data: {id : imp_id, saveImport: 1},
        type: "POST",
        success:  function(data){
           alert( data );//send this ID to the PHP variable without
                     //refreshing the file
        }
     });
     event.preventDefault();

});

</script>

Upvotes: 1

Louys Patrice Bessette
Louys Patrice Bessette

Reputation: 33933

.preventDefault() will prevent the link from loading the target page... And then, ajax will proceed.

$('.saveImport').click(function(event) {
  event.preventDefault();

Upvotes: 0

Related Questions