Jason Mayo Jason Mayo - 18 days ago 6
Ajax Question

502 Bad Gateway - jQuery / AJAX Form

I'm using the Ajax Form (http://malsup.com/jquery/form/) to submit a form I've created.

Locally, this works perfectly... But when I put it on the server, it's throwing this error in the console...


Failed to load resource: the server responded with a status of 502 (Bad Gateway) https://website.co.uk/shop/tents-by-brand/easy-camp


If I press the button a second time, I get this error


POST https://website.co.uk/shop/tents-by-brand/easy-camp 502 (Bad Gateway) jquery.min.js:4
send
f.extend.ajax
$.fn.ajaxSubmit
doAjaxSubmit
f.event.dispatch
h.handle.i


Is it possibly something to do with the SSL / HTTPS?

My code looks like this:

function updateCart(data, statusText, xhr, $form) {
if (data.success) {
$("input[name=XID]").val(data.XID);
$('.cart-total').html(data.cart_total);
$("#notification-content").text('The item has been added to your basket');
$("#notification-alt").delay(2000).fadeOut(
500,
function(){
$("#notification-content").text('Please wait... Adding item to basket.');
}

);
}
return true;
}

// Ajax Form Options

var ajaxFormOptions = {
success: updateCart,
dataType: 'json'
}

// Form Actions

$(".cart-submit-button").click(function(event){

$("#notification-alt").fadeIn(500)

var formId = $(this).parent('form').attr('id');
var formIdHash = '#' + formId;

$(formIdHash).ajaxForm(ajaxFormOptions);

console.log('Clicked = ' + formId);

});

Answer

I had the same issue. I ended up turning nginx off on my Plesk server to fix the issue.

To turn off nginx on a Plesk server:

Home > Tools Settings > Service Management > Stop Reverse Proxy (nginx)