Wordpress woocommerce Cart Shortcode not loading correctly - php

Question

Hi everyone I have this woocommerce shortcode on my category page
<div id="za_left">
<h2>Wöchentlich</h2>
<div id="za_list">[product_category category="woechentlich" per_page="55" columns="1" orderby="date" order="desc"]</div>
<div id="za_right">
[woocommerce_cart]
</div>
This brings up the list of products and the cart which is empty at the start.
Now on the first click the item is added to the cart, but the shortcode is not updating the cart, so it shows it is still empty.
So the cart on the right side is not reloading/refreshing.
After I refresh the page it is showing the cart and I can add product like it should be.
How can I refresh the cart or reload the div, without reloading the page?
Maybe someone came across a similar problem. The cart is with ajax enabled.
You can visit
http://lesezirkel-westermann.de/wordpress/zeitschriftenauswahl/
to see this issue, please note that the left side is not css'ed right now.
Edit1:
I found a solution. cart-empty.php is loaded when the cart is empty, which is okay, but this php file doesn't give the oppotunity to load item into the cart.
So I copied the content from cart.php to cart-empty.php and it is now working. not a nice solution though.
Maybe someone finds a better one.

Answer 1

Please try the woocommerce with some other pre-installed theme like 2012 or some other
Please review the below link
https://wordpress.org/support/topic/cart-widget-not-updating-in-woocommerce-201
https://wordpress.org/support/topic/woocommerce-update-cart-button-not-working

Answer 2

You can load the any specific div on DOM. Whenever the add to cart button trigger then refresh the particular div in which your cart is like
$("#yourSidebarCartDIv").load('YourUrl');
OR
$("#yourSidebarCartDIv").load(location.href + " #yourSidebarCartDIv");

Answer 3

What you can do to achieve desire result is, use in built cart form of the woocommerce.
So your your code would be something like this :
<div id="za_left">
<h2>Wöchentlich</h2>
<div id="za_list"><?php echo do_shortcode('[product_category category="woechentlich" per_page="55" columns="1" orderby="date" order="desc"]') ?></div>
<div class="woocommerce">
<?php
wc_print_notices();
do_action( 'woocommerce_before_cart' ); ?>
<form action="<?php echo esc_url( WC()->cart->get_cart_url() ); ?>" method="post">
<?php do_action( 'woocommerce_before_cart_table' ); ?>
<table class="shop_table cart" cellspacing="0">
<thead>
<tr>
<th class="product-remove"> </th>
<th class="product-thumbnail"> </th>
<th class="product-name"><?php _e( 'Product', 'woocommerce' ); ?></th>
<th class="product-price"><?php _e( 'Price', 'woocommerce' ); ?></th>
<th class="product-quantity"><?php _e( 'Quantity', 'woocommerce' ); ?></th>
<th class="product-subtotal"><?php _e( 'Total', 'woocommerce' ); ?></th>
</tr>
</thead>
<tbody>
<?php do_action( 'woocommerce_before_cart_contents' ); ?>
<?php
foreach ( WC()->cart->get_cart() as $cart_item_key => $cart_item ) {
$_product = apply_filters( 'woocommerce_cart_item_product', $cart_item['data'], $cart_item, $cart_item_key );
$product_id = apply_filters( 'woocommerce_cart_item_product_id', $cart_item['product_id'], $cart_item, $cart_item_key );
if ( $_product && $_product->exists() && $cart_item['quantity'] > 0 && apply_filters( 'woocommerce_cart_item_visible', true, $cart_item, $cart_item_key ) ) {
?>
<tr class="<?php echo esc_attr( apply_filters( 'woocommerce_cart_item_class', 'cart_item', $cart_item, $cart_item_key ) ); ?>">
<td class="product-remove">
<?php
echo apply_filters( 'woocommerce_cart_item_remove_link', sprintf( '×', esc_url( WC()->cart->get_remove_url( $cart_item_key ) ), __( 'Remove this item', 'woocommerce' ) ), $cart_item_key );
?>
</td>
<td class="product-thumbnail">
<?php
$thumbnail = apply_filters( 'woocommerce_cart_item_thumbnail', $_product->get_image(), $cart_item, $cart_item_key );
if ( ! $_product->is_visible() )
echo $thumbnail;
else
printf( '%s', $_product->get_permalink(), $thumbnail );
?>
</td>
<td class="product-name">
<?php
if ( ! $_product->is_visible() )
echo apply_filters( 'woocommerce_cart_item_name', $_product->get_title(), $cart_item, $cart_item_key );
else
echo apply_filters( 'woocommerce_cart_item_name', sprintf( '%s', $_product->get_permalink(), $_product->get_title() ), $cart_item, $cart_item_key );
// Meta data
echo WC()->cart->get_item_data( $cart_item );
// Backorder notification
if ( $_product->backorders_require_notification() && $_product->is_on_backorder( $cart_item['quantity'] ) )
echo '<p class="backorder_notification">' . __( 'Available on backorder', 'woocommerce' ) . '</p>';
?>
</td>
<td class="product-price">
<?php
echo apply_filters( 'woocommerce_cart_item_price', WC()->cart->get_product_price( $_product ), $cart_item, $cart_item_key );
?>
</td>
<td class="product-quantity">
<?php
if ( $_product->is_sold_individually() ) {
$product_quantity = sprintf( '1 <input type="hidden" name="cart[%s][qty]" value="1" />', $cart_item_key );
} else {
$product_quantity = woocommerce_quantity_input( array(
'input_name' => "cart[{$cart_item_key}][qty]",
'input_value' => $cart_item['quantity'],
'max_value' => $_product->backorders_allowed() ? '' : $_product->get_stock_quantity(),
'min_value' => '0'
), $_product, false );
}
echo apply_filters( 'woocommerce_cart_item_quantity', $product_quantity, $cart_item_key );
?>
</td>
<td class="product-subtotal">
<?php
echo apply_filters( 'woocommerce_cart_item_subtotal', WC()->cart->get_product_subtotal( $_product, $cart_item['quantity'] ), $cart_item, $cart_item_key );
?>
</td>
</tr>
<?php
}
}
do_action( 'woocommerce_cart_contents' );
?>
<tr>
<td colspan="6" class="actions">
<?php if ( WC()->cart->coupons_enabled() ) { ?>
<div class="coupon">
<label for="coupon_code"><?php _e( 'Coupon', 'woocommerce' ); ?>:</label> <input type="text" name="coupon_code" class="input-text" id="coupon_code" value="" placeholder="<?php _e( 'Coupon code', 'woocommerce' ); ?>" /> <input type="submit" class="button" name="apply_coupon" value="<?php _e( 'Apply Coupon', 'woocommerce' ); ?>" />
<?php do_action('woocommerce_cart_coupon'); ?>
</div>
<?php } ?>
<input type="submit" class="button" name="update_cart" value="<?php _e( 'Update Cart', 'woocommerce' ); ?>" /> <input type="submit" class="checkout-button button alt wc-forward" name="proceed" value="<?php _e( 'Proceed to Checkout', 'woocommerce' ); ?>" />
<?php do_action( 'woocommerce_proceed_to_checkout' ); ?>
<?php wp_nonce_field( 'woocommerce-cart' ); ?>
</td>
</tr>
<?php do_action( 'woocommerce_after_cart_contents' ); ?>
</tbody>
</table>
<?php do_action( 'woocommerce_after_cart_table' ); ?>
</form>
<?php //do_action( 'woocommerce_after_cart' ); ?>
</div>
Simply just paste it.
Let me know the output.