admin 管理员组文章数量: 1087652
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 = '.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.
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.
Share Improve this question asked May 13, 2016 at 15:15 H.KimH.Kim 35 bronze badges 11- Bro it's just "php", but +1 for effort – TheDeadMedic Commented May 13, 2016 at 15:58
- Thats exactly the type of help I was looking for thanks -____- – H.Kim Commented May 13, 2016 at 16:13
- Sorry couldn't resist. Do you know how to use the browser console? We need to know what kind of error you're getting. – TheDeadMedic Commented May 13, 2016 at 16:18
- I would also add that since this only works with some browsers, it must be a client-side issue. – TheDeadMedic Commented May 13, 2016 at 16:19
- Nothing on Firefox's and Safari's console, besides the console.logs thats in my code. :/ @TheDeadMedic – H.Kim Commented May 13, 2016 at 16:38
1 Answer
Reset to default 0So turns out that on Safari and Firefox, the page would refresh before the email got sent out. As a workaround I just created another button that the user has to click on before clicking on the actual button that updates their profile information. The click event handler on that first button is being used to send out the information to the php file now. It solved the problem and now I'm getting emails no matter what browser the user is updating their profile from!
Heres's the javascript:
(function($){
$(document).ready(function(){
// console.log('mailajax is enqueued, showing on firefox');
setTimeout(function(){
if($('html').hasClass('user-section')){
// console.log('this is a user page');
$('input.um-button').hide();
$('.um-profile .um-col-alt .um-left.um-half').prepend('<a id="custom-update-btn">Approve Changes</a>');
}
var ogArray = new Array(),
newArray = new Array(),
dropOgArray = new Array(),
dropNewArray = new Array(),
difference,
username = String($('.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(),
$value = $(this).val();
ogArray[$key] = $value;
});
$('span.select2-chosen').each(function() {
var $key = $(this).closest('.um-field').find('label').text(),
$value = $(this).text();
dropOgArray[$key] = $value;
});
$('input.um-form-field').on('keyup', function(){
$('form').find('input.um-form-field').each(function() {
var $key = $(this).closest('.um-field').find('label').text(),
$value = $(this).val();
newArray[$key] = $value;
});
});
$('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(),
$value = $(this).text();
dropNewArray[$key] = $value;
});
// console.log(diffObject(dropOgArray, dropNewArray));
}, 1000);
});
$('a#custom-update-btn').on('click', function(e){
// console.log('update btn has been clicked on');
var ajaxurl = 'http://www.reformeducators.org/wp-content/themes/NATE/admin-ajax.php',
stringDifference = JSON.stringify(diffObject(ogArray, newArray)),
stringDropDifference = JSON.stringify(diffObject(dropOgArray, dropNewArray));
$.post(ajaxurl, { 'Name': username, 'Changes Made': stringDifference, 'Drop Menu Changes': stringDropDifference});
$('a#custom-update-btn').hide();
$('.um-profile-body .um-button').show();
});
}, 1000);
});
})(jQuery);
本文标签：
版权声明：本文标题：jquery - Using Custom Javascript and pHp to send email to myself when a user clicks on an input button but only works on Chrome, 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.roclinux.cn/p/1736276598a1731992.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
发表评论