Announcement

Collapse
No announcement yet.

conditional display of cart related links

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

    conditional display of cart related links

    Hello,

    In a normal setting, the top navigation bar displays the cart summary plus the 'view cart' and 'checkout' links. What I would like to do is find a way to display those only if the cart contains at least one item. Seems logical since, if the cart is empty, then there is no need to display anything about it. So, I figured that would just be a matter of testing getCartItem(3), right? But how can I use this information in a conditional block? I've tried with a php block, assigning all necessary information/variables to php equivalents, but every attempts failed due to my failing to grasp actinic's unorthodox way of mixing php code with its own code.

    lazyeye

    #2
    Hi Lazyeye,
    What you are trying to do, if I understand correctly, is use the client-side javascript function getCartItem(3) to check if the cart is empty, and if it is (or isn't) then display or hide the cart summary?

    As this is client side scripting (i.e. happens on the customers browser) your use of PHP or conditional blocks will not help.

    The simplest way to do this would be to have the cart summary in some <div> or <span> tag whose CSS display propoerty can be set to 'none' or 'block' respectively. This 'none'/'block' state effectively hides and un-hides the contents of the element that the property is assigned to. You can trigger this state change by calling a javascript function to do this e.g. each time the page is loaded.

    e.g.

    In the head of your overall layout for each page you want this behaviour on your would have:

    Code:
     <script language="javascript" type="text/javascript">
          <!-- 
          function showhidecart()
          {
          if (getCartItem(3) < 1)
    			{
    			document.getElementById('cart').style.display = 'none';
    			}
    		else
    			{
    			document.getElementById('cart').style.display = 'block';
    			}
          }
    		// -->
    		</script>
    In the body tag you would want to make sure the function was called when the page loaded:
    e.g.
    Code:
    <body onload="<actinic:variable value="PreloadImages" name="OnLoadScript" />;showhidecart();">
    and then, for this example, you would need to make sure the HTML and elements you wish hidden were surrounded by an HTML element assigned the ID of 'cart'
    e.g.
    Code:
    <span id="cart">
    <actinic:variable name="CookieCartItemsLabel" />
       <script language="javascript" type="text/javascript">
    	   <!--
    	   document.write(getCartItem(3));
    	   // -->
       </script>,
    <actinic:variable name="CookieCartValueLabel" />
       <script language="javascript" type="text/javascript">
    	   <!--
    	   document.write(getCartItem(1));
    	   // -->
       </script>
       
       </div>
    NOTE: Just an example - not fully tested, but the idea is there for you to try.
    Fergus Weir - teclan ltd
    Ecommerce Digital Marketing

    SellerDeck Responsive Web Design

    SellerDeck Hosting
    SellerDeck Digital Marketing

    Comment


      #3
      why

      didn't I think of it? Of course, you're right and I'll try that.

      thanks

      Comment

      Working...
      X