We recently started using distance based shipping for certain products. I have separated the shipping method from the review-order (picture of the design below). I basically just moved wc_cart_totals_shipping_html(); to form-checkout and it worked fine until we started using distance based shipping. I noticed that when the address is updated the price in review-order is updated but not the shipping method. Only after page refresh it would sync up.
I understand that the problem comes from AJAX not refreshing the part that I moved out but not sure how to fix it. The furthest I got with this was finding a thread with similar issue https://wordpress.org/support/topic/update-shipping-methods-in-checkout-via-ajax/. The method here is technically working (the shipping method is updating) but it causes another set of strange things that I could not figure out and I do not completely understand what it does. Namely I have sectioned the checkout process into sections and each of them can be opened as a dropdown through some jQuery. But after the "solution" above, I could not target the HTML elements brought in with JS anymore.
My solution before the "solution" above:
form-checkout.php
if ( WC()->cart->needs_shipping() && WC()->cart->show_shipping() ) : ?>
<table class="checkout-shipping-table">
<?php wc_cart_totals_shipping_html(); ?>
</table>
<?php endif; ?>
Related
Ok - trying to slowly work my way through this - bear with me! Will try to describe what I'm doing here.
Using Woocommerce with theme called Flatsome - but this problem seems to relate to how Woocommerce updates the cart on the cart page.
So I am trying to bend Woocommerce to suit - so when client gets to Cart page - they do not move onto Checkout - instead I am giving them a Button to Request a Quotation - button when click opens a modal with a GravityForm in it.
I've been able to get the product list, quantities, price and SKU passed fine into the form ok using a 3rd party plugin ....
but boy oh boy - can I easily pass through the most recent TOTAL from woocommerce??
Not as easy as I'd hoped!
I had originally written this function into my functions.php
// Send the page url to parameter called 'gdcarttotal' for use in gravity forms
add_filter("gform_field_value_gdcarttotal", "populate_gd_carttotal");
function populate_gd_carttotal(){
global $woocommerce;
$totalamount = $woocommerce->cart->cart_contents_total;
return $totalamount;
}
And yes that seemed to pass through the Total of the Cart ok.
The problem arises if the quantities are updated whilst on that Cart page.
So if I update the quantity of a product - the totals etc all update fine on the Woocommerce cart page total BUT if I then click the launch Quotation form - the value for the Cart Total remains the value of the original total when user landed on that page. So it takes a full page refresh on the cart page to flush it and update it to the correct value.
Someone mentioned to me, Ajax which is beyond my capabilities.
Really just reaching out - and asking what is best way - or how could I write a function whilst on the cart page that will always give me the most updated TOTAL to pass through into a field on a form.
I've got a couple of screenshots but since my first time on here... I'm not sure if I can post or not. Hopefully this description tells the story.
Basically looking to know - whilst on the Woocommerce Cart page, how to pass the most recent TOTAL calculation to a form or page etc...
Thanks guys!!
Gareth
Your base issue is with the language you're using to solve the problem. You've written PHP, which is server-side (i.e., not real-time).
The WooCommerce cart is AJAX, a hybrid of JavaScript and XML, and it's processed client-side (i.e., in the browser) in real-time. That's how you are able to update the quantity and cart totals without a full page reload, and it's how the website is able to see how many items you have in the cart without reloading the page. Because of this, your solution needs to be client-side using JavaScript, I believe.
I'm not a pro developer, so I don't have the exact code to give you, but hopefully this gets you on the right track. You can also read more about AJAX here: https://www.w3schools.com/whatis/whatis_ajax.asp
Current Issue:
My checkout calculator refreshes shipping rates way too often, currently it update/refreshes shipping rates when I change a payment method, or I choose a different shipping method as well as when I change an address field or modify a quantity in cart & it even does one upon cart opening in browser. (I understand some merchants may need these to update due to fees associated with certain payment gateways or shipping methods, but to me why do I need to pull live shipping rates again when all I did was click on local pickup, or something that shouldn't have any affect at all on shipping carrier rates)
What I'm trying to accomplish:
I would like the checkout/cart calculator to stop auto update/refresh shipping rates all together until the end of checkout where it should place 1 after I've entered all attributing factors into appropriate fields necessary to make the call, at least IMO.
I have read through hundreds of posts but all I'm turning up is ways to ensure checkout calculator refreshes on certain Ajax calls I need it to be disabled for any factor. I'm still pretty new here so I apologize if I'm breaking some protocols please forgive, and any help will be greatly appreciated.
Update:
After thinking on this some more I feel a perfect solution (if possible) would be to place a button in the checkout calc shipping area, or down by the place order button that would allow me or a customer to manually pull the shipping rate API and update totals when necessary and do away with the entire automatic process(this would also benefit me in that woocommerce would stop trying to make a new call after every keystroke), but this would also necessitate the need for a function or something the like to keep an order from being placed unless this manual button had been pressed immediately prior to place order button (and they would need to press it again upon making any address field changes, or changing a shipping method or any other factor that would affect the order totals, exclude things like name, phone number, Company Name, or any other field you can think of that wouldn't affect order total at all).
8 hours later -
I'm still banging my head at this no real results. The only thing I've accomplished is hiding the shipping calc in the cart with this
function disable_shipping_calc_on_cart( $show_shipping ) {
if( is_cart() ) {
return false;
}
return $show_shipping;
}
add_filter( 'woocommerce_cart_ready_to_calc_shipping', 'disable_shipping_calc_on_cart', 99 );
But it doesn't actually stop the API call just hides it. Although I think some time may be saved not having to generate the UI for the field, it's a negligible amount. If only cart would just display order total/tax breakdown like it does in desktop drop down or mobile sidebar that would speed my cart experience up a whole lot. Either way I prefer it not to be in the cart.
Depressing, if only the whole automated update waited for a button press at the end I would save so much time. As well as my customers. I mean doesn't this make sense. Let me describe my workflow through rounds of testing. Eight payment gateways custom configured with rules granting visibility need to all be tested through every variable & here is how it apparently must be done to test the front end(At least in my case, I'm very new to this & I never even considered building a website until I was approached 3-4 months ago about it). I'll shorten the entire experience by going right to the part where I'm entering the cart with 1 of my many orders.
cart opens in browser... Shipping API call 10-15 sec for callback, Update some order quantities if needed... Shipping API call 10-15 sec,(as stated above there is no shipping calc visible here. So thank god I can not be tripped up by another... Shipping API call 10-15 sec while still in the cart), Proceed to checkout, Account credentials auto populate fields... Shipping API call 10-15 sec, I may need to test shipping across a larger distance or commercial/residential rates so change address fields.... shipping API call 10-15 sec, Select Shipping Method... Shipping API call 10-15 sec, Select payment method & ... yep Shipping API call 10-15 sec..... & finally I can place the order through the front end. :( sound exhausting to you? wouldn't it make sense to bypass all those Shipping API calls and just done 1 at the very end of checkout? Hmm that's like 2 min of potentially lost time in the checkout experience. That call ould have been resolved in 1, 10-15 sec manual button press to update.
IDK something like 10 hours in now... I had a little more progress made when I removed update_totals_on_change from all checkout fields but ZIP code. I left ZIP enabled because I was afraid this method might allow you to run through the rest of the order process. Then come back to shipping fields change address and not trigger an update_total and have the order process. At this point I'm not sure if this was necessary or not but I thought if any factor truly affected the order total it would be the zip code & my shipping API will not let an order process if all the other address fields don't correlate with the zip code. So I though better safe. So that will save a bundle of time for those fields(although those fields don't lockout upon API call the way shipping and payment radios do, but at least it saves u waiting on 1 after the very last keystroke. Unless that last keystroke is in the ZIP field, hmm I may need to relocate the field farther up the form to allow it to get started earlier in the process. Whoops long tangent but thinking aloud...) hmmm if only the automated process allowed you to toggle these radios during its call you could potential complete the order in one sitting and allow the process to do its thing the whole time finally resolving itself at the end, seems a little inefficient overhead wise, but is sounding like the most rational idea I've thought of yet...Yeah, unlock all fields/radios, whatever.... while the API is processing... what I'm getting at is a way to get at the greyed out areas that have no way to be interacted with during the update/refresh... Any ideas?
Next day-
After passing out in my labor I didn't have time to test what removing update_totals_on_change from shipping fields did. Unfortunately I discovered this morning that this accomplished nothing. All address fields still auto update on change, disappointing. I'm considering adding better usability plugin to allow for quantity changes at checkout. This would at least eliminate any need to go to the cart page. So that could cut out a step or two.
Another Update:
So I found this bit of code in wp-content/plugins/woocommerce/templates/checkout/payment.php
<?php esc_html_e( 'Since your browser does not support JavaScript, or it is disabled, please ensure you click the <em>Update Totals</em> button before placing your order. You may be charged more than the amount stated above if you fail to do so.', 'woocommerce' ); ?>
<br/><button type="submit" class="button alt" name="woocommerce_checkout_update_totals" value="<?php esc_attr_e( 'Update totals', 'woocommerce' ); ?>"><?php esc_html_e( 'Update totals', 'woocommerce' ); ?></button>
</noscript>
So there seems to be something that will propogate said button if your browser does not support java script. However, I would not want to disable javascript for my whole site, but maybe I can disable it on checkout only and it won't affect much other than generating the above button at checkout. Looking into this, again any advice would be greatly appreciated.
New Info-
So after turning this over again and again. I discovered that by disabling jquery-blockui script It will then allow me to change any field in checkout without locking up during call. However when disabled there is no call being placed upon field changes, so I need to find a way to initiate the call manually and then lock it up somehow so customer must update immediately prior to placing order.
Not a complete answer to your issue but I am struggling with EXACTLY the same problem.
Woocommerce shipping modifications required to support HTTP API shipping calcs
Though I have managed to stop it calling out and calculating the shipping on cart item addition/modification by adding the following to calculate_Shipping method of my custom shipping plugin.
if ('https://aaa.bbb/checkout/' !== $_SERVER['HTTP_REFERER']) {
return;
}
I am starting to think I need to do the same as you were working on by adding a calculate shipping button that must be pressed before ordering. It must also be run again after any address update before checkout was allowed to be completed.
Did you solve your problem in the last months? If so would appreciate your solution!?!
After changing the shipping method on the Checkout page of my Woocommerce store, the total price does not update to reflect the new shipping cost.
I disabled all plugins, checked for errors, but everything is running like it should - except the total won't update.
I can't find anything about this on Google either. Anyone know what would cause this, or what steps I need to take to fix?
I had this problem and it was caused by outdated custom woocommerce template files.
For example, the review-order.php file in themes/my-theme/woocommerce/ was outdated and it included some of my own code.
I updated the version of that file, brought my custom code over and voila, upon changing shipping methods it successfully makes an AJAX call and refreshes the order totals.
In your case problem with html classes. When editing the checkout/review-order.php file, you need to keep the right html class shop_table woocommerce-checkout-review-order-table at the highest parent node. The file should look something like this:
<div class="shop_table woocommerce-checkout-review-order-table">
<?php //do stuff, add or remove anything you want ?>
</div>
I have tried a lot of different suggestions to get this to work, none of which have - these include the addToCart URL method and the $cart->addProduct method.
I can not seem to find any other way of doing this, and have also not found anyone on 1.8 to have this working.
What I am doing is adding a sample system to the site, this means that a product is added to the system programatically (Which works great) and then add this product to the cart (uh oh).
I need the add to cart form on each product to display separate quantity fields so items of different attributes can be added at the same time. This is for a photography site, so it makes sense for the customer to order 2 6x4 prints and one 10x8.
Right now the add to cart form is something like this:
Here is a mockup of what I want to have:
I have no idea which hooks to use, or if it's even possible to add multiple product variants in one POST. Is anyone familiar enough with the Ubercart api to tell me how I can go about doing this.
I found this googling for a solution to the same problem. Unfortunately I couldn't find anything.
So I made a patch and sent it in to an issue with a similar request - http://drupal.org/node/782154#comment-3925090
The patch isn't tested very well yet, but I will be going live with it or a subsequent solution in a couple of weeks.
Hope it helps.