Refreshing mini-cart when following the link to checkout/order-received - wordpress

Auto-updating the cart on the site using this action works well:
add_action( 'wp_footer', 'cart_update_qty_script' );
function cart_update_qty_script() {
if (is_cart()) :
?>
<script>
jQuery('div.woocommerce').on('change', '.qty', function(){
jQuery("[name='update_cart']").removeAttr("disabled").trigger("click");
});
</script>
<?php
endif;
}
The cart and the ordering page have been united into one (just "cart")
When switching from the "cart" page to the "checkout/order-received" page, the mini-cart does not become zero. Only updating manually makes the mini-basket null. (Basically, you have already finished with the order, getting thanked for your order, yet the miniature is still not refreshed.)
Is there any way to fix it? I use WooCommerce 6.5.1. Payment is disabled on the site.

Related

Contact Form 7 not submitting using Ajax

I have a form that's inserted into a template using shortcode
<?php echo do_shortcode('[contact-form-7 id="370" title="Contact form 1"]') ?>
I'm trying to setup an event so that when the form is submitted I can redirect the user to another page. I'm using the following;
<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
location = 'http://example.com/';
}, false );
</script>
The problem is, when you submit the form, the whole page is reloaded so the event is never triggered because the form isn't submitted via an ajax call.
This is the first time I'm trying to integrate a form into Wordpress, so I think I may have missed something. There are no errors in the developer console in Chrome.
Somewhere in your theme (check functions.php) or your wp-config.php file, you need to look for and remove the following:
functions.php
add_filter( 'wpcf7_load_js', '__return_false' );
config.php
define( 'WPCF7_LOAD_JS', false );
These lines would prevent the default behavior of CF7.
My theme was missing;
Adding that solved the issue.

javascript woocommerce form validation on add to cart buton before adding to cart

I have a custom page that displays a product with variations, a custom field and add to cart button.
I need to trigger some validation in javascript when the add to cart button is clicked, but if the form doesn't validate, then add to cart can't be performed.
I'd like to know if it's possible to achieve.
First I tried to do as explained here :
WooCommerce add to cart validation: prevent add to cart
It's working great and I'd like to be able to use this code but for me it can't be because :
- I'm using a custom page and not the usual woocommerce product page
- This means that after validation, I'm redirected to the standard woocommerce page which is blank
That's why I really need to use Javascript to perform this:
- javascript or jquery function triggered on the add to cart click
- then the function checks it everything is ok
- if yes, then product can be added to cart
- if no, an alert is displayed and the user remains on the same page, nothing added to cart.
I tried to be as clear as possible.
Hoping I can get some help.
Thanks a lot.
Please try this way:
function so_validate_add_cart_item( $passed, $product_id, $quantity, $variation_id = '', $variations= '' ) {
<script>
jQuery(function($){
jQuery(document).on('click', '.single_add_to_cart_button', function (e) {
e.preventDefault();
// your validation here
});
});
</script>
}
add_filter( 'woocommerce_add_to_cart_validation', 'so_validate_add_cart_item', 10, 5 );

How to reset all fields when adding to WooCommerce Cart

I'm developing a site with WooCommerce and have used the plugin Product Addons to add extra fields of text to the item being purchased (name, email address, phone number, etc). When someone clicks on "Add to Cart", the site currently adds the product to the cart, refreshes the page, but the previous data remains in the fields. I want to reset all the fields and make them empty after the product has been added.
I tried using this function:
( function($) {
$( document.body ).on( 'added_to_cart', function() {
$('input').val(''); }
);
} ) ( jQuery );
Any suggestions?
If the page literally refreshes itself then it is not at all standard. It was done just to update the mini cart at the top right corner of your menu and products are being added through ajax. In this case you can't empty all fields on some event because the page is being refreshed, what you have to do is write you code under document.ready function, perform $.each function on the common class or input and empty the input fields.
Try this action hook in your plugin or theme functions.php file
add_filter( 'woocommerce_checkout_get_value', 'misha_clear_checkout_fields_vals' );
function misha_clear_checkout_fields_vals($input){
return '';
}

Woocommerce add_to_cart hook empties cart

I'm using the woocommerce_add_to_cart action hook like so:
add_action('woocommerce_add_to_cart', 'display_more_modal', 10, 6);
function display_more_modal( $cart_item_key, $product_id, $quantity, $variation_id, $variation, $cart_item_data ) {
echo "<h1>Test Title here...</h1>";
//or
?>
<h1>More text here</h1>
<?php
}
I have found that if I echo out HTML or output HTML, as illustrated above, it removes all items from the cart, once I go the cart to view what I have added.
Could you some illustrate what I am possibly doing wrong? I have a suspicion that I have to return a value instead of echoing it.
If this is the case, please help as to how I can echo out HTML when a user adds a product to the cart. This HTML will be a popup with related products. Thank you.
I figured that some hooks within Wordpress don't like echoing anything out. I'm not sure how hard & fast this rule is but I remember it generally tends to be bad practice to echo anything out within functions. Instead they should return something. I simply created the product which was created and returned that. In the view file I created an if statement which outputs the html for the modal if a product exists. That seems to have fixed it.

Woocommerce clear cart after payment

I'm having trouble clearing my cart after payment but I'm using Woocommerce.
I used codes and plugin from an older site (before the major update in the beginning of the year) and that doesn't seem to work now on the new updated site.
This is the functions.php
// check for clear-cart get param to clear the cart
add_action( 'init', 'woocommerce_clear_cart_url' );
function woocommerce_clear_cart_url() {
if ( isset( $_GET['clear-cart'] ) ) {
global $woocommerce;
$woocommerce->cart->empty_cart();
}
}
In the thankyou.php that appears after succesfull payment this code is in there.
<!-- clear cart after successfull payment -->
jQuery(function($) {
$.post("http://ihavetakenoutmydomain.org?clear-cart",{},function(response){
var NewCart = $(response).find('#header-cart-inner');
$('#header-cart').html(NewCart);
var NewCartItems = $(response).find('.cart-items-inner');
$('.cart-items').html(NewCartItems);
});
});
I'm using the same theme as in the older version so the header-cart-inner and header-cart are the same.
But for some reason this doesn't work with the updated Wordpress and Woocommerce.
Does anyone know what the problem might be or have another solution for clearing the cart after succesfull payment? The thankyou page should only appear after successfull payment.
I forgot one thing
If I load the link "xxx://ihavetakenoutmydomain.org?clear-cart" on my browser the cart empties. So I guess the problem would be how to activate the link on the thankyou page without redirecting away from the thankyou page.
Best regards

Resources