Html > shopping cart button

Question

I am wondering what should I properly use for an HTML table that has an add to cart buttons and buy all button.

So, Should I use

<input class="btn" type="button" value="Buy -Shopping cart"/> or can I use

<a href="#" title="Buy Shopping card"><b>&#43;</b><img width="16" height="10" alt="Cart" src="images/cart.png"></a>

Also, I would need to enable and disable those buttons using JavaScript

Answer 1

I'd say that both of your initial suggestions would be fine, it's more a matter of how you'd like your buttons to be styled. If you use the <input type='button'> method, it'll be a bit harder to use CSS to customize your buttons. Links, on the other hand, are easier to style. So, if you need custom-looking buttons, go with the <a href="#" title="Buy Shopping card"><b>&#43;</b><img width="16" height="10" alt="Cart" src="images/cart.png"></a> version.

Answer 2

That purely depends on what your shopping cart's code looks like. In general, I'd say people use buttons for internal shopping carts (that are a part of a POST form) - and input type image can be used as well for those - and links for external shopping carts (like PayPal).

To enable/disable with javascript, you could have it dynamically insert "disabled=true" for the button or take out the link and replace it with "#" for the link. But again, depends on your situation.

Answer 3

I wouldn't use an a-tag for this unless you want search engine spiders to come and click on all your add to cart and buy button -links. Think about it:)

No but seriously, a-tags is for linking pages together, and <input type="submit"> or <button> tags are for actions that changes states. Adding an item to a cart or buying something is an action that changes a state.