Ajax and PHP, post request not working

Question

So I am trying to post some some data from one PHP file to another PHP file using jquery/ajax. The following code shows a function which takes takes data from a specific div that is clicked on, and I attempt to make an ajax post request to the PHP file I want to send to.

 $(function (){
              $(".commit").on('click',function(){
                const sha_id = $(this).data("sha");
                const sha_obj = JSON.stringify({"sha": sha_id});
                $.ajax({
                   url:'commitInfo.php',
                   type:'POST',
                   data: sha_obj,
                   dataType: 'application/json',
                   success:function(response){
                      console.log(response);
                      window.location.replace("commitInfo");
                    },
                   error: function (resp, xhr, ajaxOptions, thrownError) {
                        console.log(resp);
                     }
                 });
              });
           });

Then on inside the other php file 'commitInfo.php' I attempt to grab/print the data using the following code:

$sha_data = $_POST['sha'];
echo $sha_data;
print_r($_POST);

However, nothing works. I do not get a printout, and the $_POST array is empty. Could it be because I am changing the page view to the commitInfo.php page on click and it is going to the page before the data is being posted? (some weird aync issue?). Or something else? I have tried multiple variations of everything yet nothing truly works. I have tried using 'method' instead of 'type', I have tried sending dataType 'text' instead of 'json'. I really don't know what the issue is. Also I am running my apache server on my local mac with 'sudo apachectl start' and running it in the browser as ' http://localhost/kanopy/kanopy.php ' && ' http://localhost/kanopy/commitInfo.php '.

Also, when I send it as dataType 'text' the success function runs, but I recieve NO data. When I send it as dataType 'json' it errors. Have no idea why.

If anyone can help, it would be greaat!

Answer 1

You don't need to JSON.stringify , you need to pass data as a JSON object:

$(function() {
  $(".commit").on('click', function() {
    const sha_id = $(this).data("sha");
    const sha_obj = {
      "sha": sha_id
    };
    $.ajax({
      url: 'commitInfo.php',
      type: 'POST',
      data: sha_obj,
      dataType: 'json',
      success: function(response) {
        console.log(response);
      },
      error: function(resp, xhr, ajaxOptions, thrownError) {
        console.log(resp);
      }
    });
  });
});

---

And on commitInfo.php , you have to echo string on json format

=====================================

If you want to redirect to commitInfo.php you can just:

$(".commit").on('click',function(){ 
   const sha_id = $(this).data("sha"); 
   window.location.replace("commitInfo.php?sha=" + sha_id ); 
});