So I am using jQuery and pHp together to send an email to myself whenever a user clicks on the update button of their Ultimate Member form. However, the email only sends when a user is using Chrome, IE, and Microsoft Edge. When using Safari and Firefox, it doesn't work. I am using a click event listener to send JSON to my pHp file. The JSON was originally an object that was created by a function that checks for the differences between two different objects. These objects were created using DOM traversal. In that pHp file is a mail() function that sends me the aforementioned JSON to my email. I've tried replicating the process on a test site and noticed that when I didnt add the jQuery that comes before my click listener, emails do indeed get sent from Safari and Firefox. However, if I add the jQuery code and THEN remove it and test again it won't send! It's as if my server gets permanently rejected. Here is my JS code: (function($){
$(document).ready(function(){
console.log('mailajax is enqueued, showing on firefox');
var ogArray = new Array(),
newArray = new Array(),
dropOgArray = new Array(),
dropNewArray = new Array(),
difference,
username = $('.um-name').find('a').attr('title');
function diffObject(a, b) {
return Object.keys(a).reduce(function(map, k) {
if (a[k] !== b[k]) map[k] = b[k];
return map;
}, {});
}
$('input.um-form-field').each(function() {
var $key = $(this).closest('.um-field').find('label').text();
var $value = $(this).val();
ogArray[$key] = $value;
});
console.log(ogArray);
setTimeout(function(){
$('span.select2-chosen').each(function() {
var $key = $(this).closest('.um-field').find('label').text();
var $value = $(this).text();
// console.log($value);
dropOgArray[$key] = $value;
});
console.log(dropOgArray);
},1000);
$('input.um-form-field').on('keyup', function(){
$('form').find('input.um-form-field').each(function() {
var $key = $(this).closest('.um-field').find('label').text();
var $value = $(this).val();
newArray[$key] = $value;
});
console.log(newArray);
console.log(diffObject(ogArray, newArray));
difference = diffObject(ogArray, newArray);
});
$('select.um-form-field').on('change', function(){
setTimeout(function(){
$('form').find('span.select2-chosen').each(function() {
var $key = $(this).closest('.um-field').find('label').text();
var $value = $(this).text();
dropNewArray[$key] = $value;
});
console.log(diffObject(dropOgArray, dropNewArray));
dropDifference = diffObject(dropOgArray, dropNewArray);
}, 1000);
});
$('.um-profile-body .um-button').on('click', function(e) {
$('form').on('submit', function(){
console.log('form was sent successfully');
var ajaxurl = 'http://www.reformeducators.org/wp-content/themes/NATE/admin-ajax.php';
stringDifference = JSON.stringify(difference);
stringDropDifference = JSON.stringify(dropDifference);
stringUsername = String(username);
$.post(ajaxurl, {'Name': stringUsername, 'Changes Made': stringDifference, 'Drop Down Menu Changes': stringDropDifference});
});
});
});
})(jQuery);
And here is my pHp code:
<?php
$message = "User Information has been changed\r\n";
$message .= print_r($_POST, true);
$to = "[email protected]";
$subject = "User information has been changed!";
$headers = "From: ";
mail($to, $subject, $message, $headers);
?>
I think this might be a server issue, but if anyone has any experience doing something like this, I would really appreciate some feedback or help.
