0

I would like to make "add to cart" button work in a way so that a person stays on the same page once they click on it, but that the items still gets added to their cart. How can I make that? Does it have to be ajaxified, and if yes then how? Here is the button code itself:

<div id="custom-buttons">
<div id="custom-cart">
<a href="ShoppingCart.asp">
<input class="vCSS_input_addtocart" type="image"
src="/v/vspfiles/templates/248/images/buttons/btn_addtocart.gif" 
name="btnaddtocart" alt="Add to cart" border="0" 
data-image-path="/v/vspfiles/templates/248/images/buttons/btn_addtocart.gif"/>
</a>
</div>
iamx
  • 49
  • 1
  • 12

1 Answers1

0

The question you need to ask yourself is whether you're fine with the page reload after a new cart item is added, or not.

  1. If not, it would need to be done with Ajax:
  2. If you don't mind the page reload you could send new item data to (for example) a PHP function, store the item in the session and redirect to the page the request came from.
lesssugar
  • 15,486
  • 18
  • 65
  • 115
  • Hmm, how would something like this be done with the first Option? Or better said, how can I ajaxify only this button? – iamx Aug 30 '14 at 20:08
  • Make good use of jQuery guide I linked in the answer. Basically, you would listen to `click` or `submit` event triggered on your button to fire Ajax function. The Ajax function passes the data to the backend for further action. Finally, on `success` of the Ajax function you could display a success message for the user. There's tens of examples out there on how Ajax works with PHP (and MySQL). Good luck. – lesssugar Aug 30 '14 at 20:20
  • I was looking into some of those examples, but many of them didn't work, as I am working on a Volusion (eCommerce) template some things are restricted in terms of resources and acesibility – iamx Aug 30 '14 at 20:38