Oscommerce Question posted in
The official documentation can be found here

how to use jquery to get element by id instead of javascript – Oscommerce

I have this code in my oscommerce store and I would like to use jQuery instead of javascript – how do I do this? My problem is that this code is conflicting with existing jquery code so I’m figured that if the javascript was jquery code then perhaps this code would work.

What is is meant to do is when an item is added to the cart, a popup appears telling the customer that an item is in the cart – at the moment on every page refresh it adds an item to the cart instead of just when an item is added.

    <div id="cart_overlay" onclick="document.getElementById('cart').style.display='none';     document.getElementById('cart_overlay').style.display='none'; return false;">
    </div>
    <div id="cart">
    <?php
    if (tep_session_is_registered('new_products_id_in_cart')) {
    ?>
    <!-- html code here -->

    <ul class="cartList">
    <?php
     // code here
    ?>
    </ul>
    <hr>
    <ul class="cartList">
      <li class="cartButton"><?php echo '<a href="javascript:void(0);"     onclick="document.getElementById('cart').style.display='none';     document.getElementById('cart_overlay').style.display='none'; return false;"><span     class="btn">' . IMAGE_BUTTON_CONTINUE . '</span></a></li><li><a href="'      . tep_href_link(FILENAME_SHOPPING_CART, '', 'SSL') . '">' .      HEADER_TITLE_CART_CONTENTS . ($cart->count_contents() > 0 ? ' (' . $cart->count_contents()     . ')' : '') . tep_href_link(FILENAME_SHOPPING_CART) .     '</a></li><li><a href="' . tep_href_link(FILENAME_CHECKOUT_SHIPPING, '', 'SSL') . '"><spanclass="btn">' . HEADER_TITLE_CHECKOUT . '</span></a>'; ?></li>
</ul>
<script type="text/javascript">
var item=document.getElementById("cart");
function pop(el){
    if(el.style.display=="block"){
        el.style.display="none";
        }else{
            el.style.display="block";
            }
    }
pop(item);
</script>
<script type="text/javascript">
var item=document.getElementById("cart_overlay");
function overlay(el){
    if(el.style.display=="block"){
        el.style.display="none";
        }else{
            el.style.display="block";
            }
    }
overlay(item);
</script>


<?php
tep_session_unregister('new_products_id_in_cart');
}
?>
</div>
<!-- eof Cart on Product Page //-->
Tags:

3

Answers


  1. 0

    to get an element you van use $(‘selector’)

    $('#yourid')

    this works for ids classes and elements all the same way

    see: http://www.w3schools.com/jquery/jquery_ref_selectors.asp

    Login or Signup to reply.
  2. 0

    Hey You can write your javascript code given below to Jquery like this

     Javascript code :    var item=document.getElementById("cart_overlay"); 

 JQuery Code:         $('#cart_overlay')

    You can find more selecters from here Link

    Login or Signup to reply.
  3. 0

    As Barmar said above, switching to jQuery won’t help you…
    If you still want to do so (for learning reasons), here’s a jQueryfied version of your javascript…

    <script type="text/javascript">
  var cart = $('#cart'),
      bg = $('#cart_overlay');

  function toggle_element(el){
    if( $(el).css('display') == 'block' ){
      $(el).css('display', 'none');
    }else{
      $(el).css('display', 'block');
    }
  }
  toggle_element(cart);
  toggle_element(bg);
</script>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search