[Resolved] Add to Basket does not update

[Claudia M]

Hi,

I've been styling my header to shown some cart info instead of having the popup mini basket.  I have it placed basically where I wanted (some more styling needed) but when I add an item to my cart the info in my header does not change until I refresh my browser.  My skin is custom based on foundation.

Link to store

Thanks in advance for any and all help

Claudia

[Dirty Butter]

Bsmither is not going to be around for the next few weeks, and I sure can't be of help with this. Hopefully someone else can.

[Claudia M]

Well boo on Brian LOL What will we do !!!!!    I think I may have a way to fix this.  Just move the mini basket and restyle it

 

[Dirty Butter]

He's irreplaceable. Thank goodness there are some regulars here with a good grasp. I wish I were one of them.

[Claudia M]

Me too!!!!  I did get it to work though

[Dirty Butter]

Good for you! Care to share your code?

[Claudia M]

Sure .....  Needs some work for the mobile to look right with my custom code - but it looks good enough for now

You can see it here https://www.claudiasbargains.com/

box.basket.php

{*
 * CubeCart v6
 * ========================================
 * CubeCart is a registered trade mark of CubeCart Limited
 * Copyright CubeCart Limited 2017. All rights reserved.
 * UK Private Limited Company No. 5323904
 * ========================================
 * Web:   http://www.cubecart.com
 * Email:  [email protected]
 * License:  GPL-3.0 https://www.gnu.org/licenses/quick-guide-gplv3.html
 *}
 {if !$CATALOGUE_MODE}
<div id="mini-basket">
   <div class="show-for-medium-up">
     <!-- <div class="text-right"><a href="#" id="basket-summary" class="t3 small"><svg class="icon icon-basket"><use xlink:href="#icon-basket"></use></svg>&nbsp;&nbsp; {$CART_TOTAL}</a></div> -->
      <div class="text right">
       {include file='templates/box.basket.content.php'}
      </div>
   </div>
   <div class="show-for-small-only">
      <div class="show-for-small-only"><a class="right-off-canvas-toggle button white tiny" href="#"><svg class="icon icon-basket icon-x2"><use xlink:href="#icon-basket"></use></svg><br />{$CART_TOTAL}</a></div>
      <div class="hide panel radius small-basket-detail-container js_fadeOut" id="small-basket-detail"><svg class="icon"><use xlink:href="#icon-check"></use></svg> {$LANG.catalogue.added_to_basket}</div>
   </div>
</div>
{/if}

basket.content.php

{*
 * CubeCart v6
 * ========================================
 * CubeCart is a registered trade mark of CubeCart Limited
 * Copyright CubeCart Limited 2017. All rights reserved.
 * UK Private Limited Company No. 5323904
 * ========================================
 * Web:   http://www.cubecart.com
 * Email:  [email protected]
 * License:  GPL-3.0 https://www.gnu.org/licenses/quick-guide-gplv3.html
 *}
<div class="box-basket-content thinmarg-topbottom">
   <h4 class="mini-basket-title nomarg pad-side">{$LANG.basket.your_basket}</h4>
 
  <div class="pad basket-detail">
   <div class="text-right"><a href="#" id="basket-summary" class="t4 small"><svg class="icon icon-basket"><use xlink:href="#icon-basket"></use></svg>&nbsp;&nbsp; {$CART_TOTAL}</a></div>

      {if isset($CONTENTS) && count($CONTENTS) > 0}
      <ul class="no-bullet nomarg">
      {foreach from=$CONTENTS item=item name=items}
      {if $smarty.foreach.items.index == 10}
        <!-- <li class="clearfix"><div class="left">&hellip;</div></li> -->
         {break}
      {/if}
        <!-- <li class="clearfix">
           <!-- <div class="left"><a class="t5" href="{$item.link}" title="{$item.name}">{$item.quantity} &times; {$item.name|truncate:35:"&hellip;"}</a></div> -->
            <!--<div class="right">{$item.total}</div>
         </li> -->
      {/foreach}
         <li class="clearfix nomarg">
           <!-- <hr> -->
            <div class="t4 left">{$LANG.basket_en.basket_item_count}:&nbsp;&nbsp;</div>
            <div class="t4 right">{$CART_ITEMS}</div>
         </li>
       <!--  <li class="clearfix">
            <div class="left t4 total">{$LANG.basket.total}:</div>
            <div class="right t4 total">{$CART_TOTAL}</div>
         </li> -->
      </ul>
    <!--  <div><a href="{$STORE_URL}/index.php?_a=checkout" class="button success expand nomarg">{if $CONFIG.ssl == 1}<svg class="icon"><use xlink:href="#icon-lock"></use></svg> {$LANG.basket.basket_secure_checkout}{else}{$LANG.basket.basket_checkout}{/if}</a></div> -->
      {if !$IS_USER}
      <div class="thinpad-top"><a href="{$STORE_URL}/index.php?_a=basket" class="button submit expand nomarg">{$LANG.basket.view_basket}</a></div>
      {/if}
      {else}
      <p class="t4 nopad text-center">{$LANG.basket_en.basket_is_empty}</p>
      {/if}
   </div>
</div>

cubecart.css

/* Start Mini Basket *//*
.basket-detail-container {
    position: fixed;
    z-index: 100;
    width: 250px;
    top: 27px;
    margin-left: -150px;
}
.small-basket-detail-container {
    position: fixed;
    z-index: 100;
    width: 90%;
    left: 5%;
    top: 40%;
    background-color: #397D02;
    border: none;
    color: #fff;
    font-weight: bold;
}*/
.mini-basket-title {
    background-color: #710000;
    color: #fff;
    text-align: center;
}
.basket-detail {
    background-color: #FFFFFF;
    border: 1px solid #003300;
}/*
.basket-detail .total {
    font-size: 1.2em;
    font-weight: 700;
}
.mini-basket-arrow {
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 5px solid #000;
    margin-left: 229px;
}

/* End Mini Basket */