Unable to send form data on Safari/Firefox iOS

Question

This works on all platforms except Safari/Firefox on iOS:

jQuery("#gform_1").one('submit', function(event) {
  const form = document.getElementById("gform_1");
  const firstName = document.getElementById('input_1_1').value;
  const lastName = document.getElementById('input_1_2').value;
  const phoneNumber = document.getElementById('input_1_3').value;
  const email = document.getElementById('input_1_4').value;

  const formData = {
    firstName: firstName,
    lastName: lastName,
    phoneNumber: phoneNumber,
    email: email
  };

  jQuery.ajax({
    url: 'https://www.example.com/submissions.php',
    type: 'POST',
    data: formData,
    success: function(response) {
      console.log("Success!", response);
    },
    error: function(xhr, status, error) {
      console.error("Error!", error);
      console.log(xhr.responseText);
    }
  });
});

console.error("Error!", error) is empty. It says "Error!". console.log(xhr.responseText) is also blank. I don't think this is a COR issue since Submits.php is hosted on the same server/domain as the form.

Answer 1

I need to prevent Default.

jQuery("#gform_1").one('submit', async function(event) {
  event.preventDefault();
  const form = document.getElementById("gform_1");
  const firstName = document.getElementById('input_1_1').value;
  const lastName = document.getElementById('input_1_2').value;
  const phoneNumber = document.getElementById('input_1_3').value;
  const email = document.getElementById('input_1_4').value;

  const formData = {
    firstName: firstName,
    lastName: lastName,
    phoneNumber: phoneNumber,
    email: email
  };
  const request = await new Promise((resolve, reject) => {
    jQuery.ajax({
      url: 'https://www.example.com/submissions.php',
      type: 'POST',
      data: formData,
      success: function(response) {
        console.log("Success!", response);
        resolve();
      },
      error: function(xhr, status, error) {
        console.error("Error!", error);
        console.log(xhr.responseText);
        reject(error);
      }
    });
  });
  await request;
  console.log("AJAX request completed!");
});