jQuery ajax works in Chrome, but not in Firefox or Safari

Question

I implemented ajax request with jQuery . This is the code:

//initialize value, nameValue, emailValue

$.ajax({
  url: "getPOST.php",
  type: 'POST',
  data: {
    'id': value,
    'name': nameValue,
    'email': emailValue
  },
  success: function(response) {
    console.log(response);
  }
});

The code works fine in chrome, but it fails in Safari and in Firefox. I've seen some answers to this question, but they are 6 or more years old. What could be the fix for this problem?

EDIT: By fail I mean that on php side, nothing gets stored in database when run on Firefox or Safari, but it works as expected in Chrome. There is no error messages in console. The request in Safari is shown in red, and it didn't sent any data.

I inspected the post data in Firefox and they are as they should be. No errors there. Although the request is painted in red. This is how it looks. An error on the jQuery side?

I am using this code to send data to my server, before directing user to the PayPal payment page.

jQuery code. Hope I didn't delete to many braces.

 // JavaScript Document
    jQuery(document).ready(function($){
      //you can now use $ as your jQuery object.



    //real stuff here
    $(".submit-link").click(function(e){
     var value=$.trim($(".url-submit").val());

     if(value.length>0){
     value = encodeURIComponent(value);
     var nameValue=$.trim($(".name-submit").val());
     var emailValue=$.trim($(".email-submit").val());

    if(nameValue.length>0){nameValue = encodeURIComponent(nameValue);}
    if(emailValue.length>0){emailValue = encodeURIComponent(emailValue);}


     $.ajax({
       url: "getPOST.php",
       type: 'POST',
        data: {"id":value,"name":nameValue, "email":emailValue},
       success: function(response) {
    console.log(response);
        }


    //go to link in href now
     });
        }else{
    var $urlSubmit = $('.url-submit');
      $urlSubmit.addClass('invalid');
      setTimeout(function(){
        $urlSubmit.removeClass('invalid');
      },500);

    e.preventDefault();
        }
    });


    //some other stuff

    });

Answer 1

Got to long for a comment but try excluding jquery and try simple xhr/fetch to see if it works (maybe you will get a other understandable error if you try fetch)

fetch('getPOST.php', {
   method: 'POST',
   headers: {'content-type': 'application/x-www-form-urlencoded; charset=UTF-8'}
   body: 'id=0&name=bob&email=bob%40localhost'
}).then(res => console.log(res))

(safari don't have fetch so try in firefox)

The only thing i can thing of is that you are posting cross origins... Are you posting to the same domain? Must be a network error/restriction cuz your code is valid