Menu
I am checking out the final order in WordPress using jquery ajax post request.
My Add To Cart and Check out order has the same code but the checkout order code submits the request 3 times.
var j = jQuery.noConflict();
j('.wc-checkout').on('submit', function(e) {
e.preventDefault();
var billing_customer_type = j("#billing_customer_type").val();
// .. and so on...
j.ajax({
type: 'POST',
url: 'http://localhost/mywebsite/?wc-ajax=checkout',
cache: false,
data: {
'billing_customer_type': billing_customer_type,
// and so on..
},
success: function(result) {
console.log('Order Checked Out');
},
error: function(xhr, status, error) {
console.log(error);
},
complete: function() {}
});
});
<form class="wc-checkout" method="post" enctype="multipart/form-data"
novalidate="novalidate">
<div class="form-control">
<label>Lorem Ipsum: <abbr class="required" title="required">*</abbr></label>
<select name="billing_customer_type" id="billing_customer_type"
class="select thwcfd-enhanced-select select2-hidden-accessible enhanced"
data-placeholder="" tabindex="-1" aria-hidden="true">
<option value="A" selected="selected">A</option>
<option value="B">B</option>
<option value="C">C</option>
</select>
</div>
<div class="form-control">
<!-- _wpnonce help protect URLs and forms from certain types of misuse -->
'.wp_nonce_field("ajax_checkout").'
<input type="submit" value="Order Now" class="epo-proceed-checkout-btn">
</div>
</form>
Do you know how can i make the .on submit only once? Any idea is appreciated. Thanks
662
I have solved this problem by adding stopImmediatePropagation(); and return false;
Updated code:
j('.wc-checkout').on('submit', function(evt) {
evt.preventDefault();
var billing_customer_type = j("#billing_customer_type").val();
// and so on...
j.ajax({
type: 'POST',
url: 'http://localhost/mywebsite/?wc-ajax=checkout',
cache: false,
data: {
'billing_customer_type':billing_customer_type,
// and so on...
},
success: function (result) {
console.log('Order Checked Out');
},
error: function(xhr,status,error) {
console.log(error);
},
complete:function(){
}
});
evt.stopImmediatePropagation(); // to prevent more than once submission
return false;
});
Check it but you need to test it in your environment.
var isPost = 0;
$(document).ready(function() {
$("button").click(function() {
if (isPost == 0) {
$.get("https://stackoverflow.com", function() {
console.log('post');
});
isPost = 1;
}
});
});<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
</script>
</head>
<body>
<button>Send an HTTP GET request to a page and get the result back</button>
</body>
</html>If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
