title: Prevent page reloading while submitting item to a cart.
body: <p>I am developing a <a href="http://goo.gl/6Rnpi3" rel="nofollow">shopping cart</a> and I need to <strong>prevent page reload when the adding a product to the cart</strong>. </p>
  
  <p>Currently I am using <strong>GET method</strong> to submit the product to the cart</p>
  
  <pre><code>&lt;a href="cart/add?itemid=101&amp;itemcat=starter&gt;&lt;/a&gt;
  </code></pre>
  
  <p>As you can see I am using link tag instead of forms. I tried this code to prevent page reload </p>
  
  <pre><code>  $(document).ready(function(){
      $(".prod a").click(function(){
  
          var id = $(".prod").find('input[id=itemid]').val();
          var cat = $(".prod").find('input[id=itemcat]').val();
  
          alert('ID :' + id + '\n\rCAT :' + cat);
          return false; // reload stopped
      });
  });
  </code></pre>
  
  <p>As you may have noticed I have used alert() to test the output is like <strong>I am only getting values of only 1st product rest are ignored</strong> thought of using loop . Please verify the above code or suggest other solution.</p>
  
  <p>Here is the <a href="http://jsfiddle.net/zCz4d/4/" rel="nofollow">fiddle</a> * Updated</p>
  
  <p>The problem is i am able to get item id of 1st product not 2nd </p>