I need to pass data to a php function, but I can't merge the data. I'm trying to have a progress bar while loading.
This is the code:
AJAX
$(document).on('click', '#submit_button', function(event) {
var data = [];
for (var i = 0; i < 100000; i++) {
var tmp = [];
for (var i = 0; i < 100000; i++) {
tmp[i] = 'hue';
}
data[i] = tmp;
};
$.ajax({
xhr: function() {
var xhr = new window.XMLHttpRequest();
xhr.upload.addEventListener("progress", function(evt) {
if (evt.lengthComputable) {
var percentComplete = evt.loaded / evt.total;
console.log(percentComplete);
$('.progress').css({
width: percentComplete * 100 + '%'
});
if (percentComplete === 1) {
$('.progress').addClass('hide');
}
}
}, false);
xhr.addEventListener("progress", function(evt) {
if (evt.lengthComputable) {
var percentComplete = evt.loaded / evt.total;
console.log(percentComplete);
$('.progress').css({
width: percentComplete * 100 + '%'
});
}
}, false);
return xhr;
},
type: 'POST',
data: {
action: 'my_action',
nonce: $('#my_nonce').text()
},
url: ajaxurl,
success: function(response) {
console.log(response);
},
});
});
PHP
function my_action() {
if (wp_verify_nonce($_REQUEST['nonce'], 'my_nonce')) {
wp_die('WORKS');
} else {
wp_die('BUSTED');
}
}
add_action('wp_ajax_my_action', 'my_action');
The problem is, I can't merge var data = []; with {action: 'my_action', nonce: $('#my_nonce').text()}.
I tried data push ie data.push({ action: 'my_action' });
data.push({ nonce: $('#my_nonce').text() }); but it doesnt work. Also tried $.extend() but without success. Any help would be greatly appreciated...
