[SOLVED]Quantity box on product list- Prestashop 1.5

[Rooob]

Hi,

 

I would like to put the quantity box (Where you type the number of that item that you wish to purchase) on the product list.

 

I have looked on the forum and tried some solutions but they don't seem to work for Prestashop 1.5

 

Could someone help me? I know I need to change some code in the product-list.tpl but I don't know what I should change.

 

 

Thanks

 

Please note - I don't want to display how many of the products are in stock, I want to display a box where the customer can pick how many of that product they wish to order.

Edited December 23, 2012 by Rooob (see edit history)

[Rooob]

Anyone?

[Rooob]

Okay I've figured it out.

 

I'm not good at coding so I can't answer any confusions.

 

First open product-list.tpl and find this:

 

{if ($product.allow_oosp || $product.quantity > 0)}
  {if isset($static_token)}
   <a class="button ajax_add_to_cart_button exclusive" rel="ajax_id_product_{$product.id_product|intval}" href="{$link->getPageLink('cart',false, NULL, "add&id_product={$product.id_product|intval}&token={$static_token}", true)}" title="{l s='Add to cart'}"><span></span>{l s='Add to cart'}</a>
  {else}
   <a class="button ajax_add_to_cart_button exclusive" rel="ajax_id_product_{$product.id_product|intval}" href="{$link->getPageLink('cart',false, NULL, "add&id_product={$product.id_product|intval}", true)} title="{l s='Add to cart'}"><span></span>{l s='Add to cart'}</a>
  {/if}	
 {else}
  <span class="exclusive"><span></span>{l s='Add to cart'}</span><br />
 {/if}
{/if}
<a class="button lnk_view" href="{$product.link|escape:'htmlall':'UTF-8'}" title="{l s='View'}">{l s='View'}</a>
  </div>
 </li>
{/foreach}
</ul>
<!-- /Products list -->
{/if}

 

It's like the last bit of the file.

 

Then replace the section shown above with this code:

{if ($product.id_product_attribute == 0 || (isset($add_prod_display) && ($add_prod_display == 1))) && $product.available_for_order && !isset($restricted_country_mode) &&
$product.minimal_quantity == 1 && $product.customizable != 2 && !$PS_CATALOG_MODE}
	 {if ($product.allow_oosp OR $product.quantity > 0) && $product.customizable != 2}
			 {l s='Quantity :'}
			 <input type="text" name="ajax_qty_to_add_to_cart[{$product.id_product|intval}]" id="quantity_wanted_{$product.id_product|intval}" class="text" value="{if isset
($quantityBackup)}{$quantityBackup|intval}{else}1{/if}" size="2" maxlength="3" />


	  <a class="button ajax_add_to_cart_button exclusive" rel="ajax_id_product_{$product.id_product|intval}" href="{$link->getPageLink('cart.php')}?add&id_product=
{$product.id_product|intval}{if isset($static_token)}&token={$static_token}{/if}" title="{l s='Add to cart'}"><span></span>{l s='Add to cart'}</a><br />
	 {else}
	  <span class="exclusive"><span></span>{l s='Add to cart'}</span><br />
	 {/if}
	{/if}


 {if ($product.allow_oosp || $product.quantity > 0)}
  {if isset($static_token)}

  {else}
   <a class="button ajax_add_to_cart_button exclusive" rel="ajax_id_product_{$product.id_product|intval}"
href="{$link->getPageLink('cart',false, NULL, "add&id_product={$product.id_product|intval}", true)} title="{l s='Add to cart'}"><span></span>{l s='Add to cart'}</a>
  {/if}


 {else}
  <span class="exclusive"><span></span>{l s='Add to cart'}</span><br />
 {/if}
{/if}
<a class="button lnk_view" href="{$product.link|escape:'htmlall':'UTF-8'}" title="{l s='View'}">{l s='View'}</a>
  </div>
 </li>
{/foreach}
</ul>
<!-- /Products list -->
{/if}

 

Then reload your product list page on your web browser to check it's right. It should reload with a quantity box but it won't work properly yet. If there is an error, you've copied it wrong or i've written it wrong.

 

Next, get your ajax-cart.js from prestashop\modules\blockcart and replace this:

 

//for every 'add' buttons...
$('.ajax_add_to_cart_button').unbind('click').click(function(){
var idProduct =  $(this).attr('rel').replace('ajax_id_product_', '');
if ($(this).attr('disabled') != 'disabled')
ajaxCart.add(idProduct, null, false, this);
return false;
})

 

with this:

 

//for every 'add' buttons...
$('.ajax_add_to_cart_button').unbind('click').click(function(){
var idProduct =  $(this).attr('rel').replace('ajax_id_product_', '');
if ($(this).attr('disabled') != 'disabled')
ajaxCart.add(idProduct, null, false, this,$('#quantity_wanted_'+ idProduct).val());
//alert($('#quantity_wanted_'+ idProduct).val());
return false;
});

 

Now check it and be amazed!!!!

 

If it doesn't work let me know and i'll check I copied the right bit of code to this post. I'm being careful not to touch it at the moment as I don't want to break it!!!

 

Please let me know if this helped you.

 

I should say thanks to the people on this thread for the codes

Edited December 23, 2012 by Rooob (see edit history)

[Zahorijs]

First of all, thank you very much Rooob, you helped me a lot!

 

Secondly I would like to post simplified version of Rooobs guide for easier customization of non-default templates.

 

In your templates product-list.tpl add the following code where you want quantity box to appear

 

{l s='Quantity:'}
<input type="text" name="ajax_qty_to_add_to_cart[{$product.id_product|intval}]" id="quantity_wanted_{$product.id_product|intval}" class="text" value="{if isset
($quantityBackup)}{$quantityBackup|intval}{else}1{/if}" size="2" maxlength="3" />

 

 

Next edit ajax-cart.js from prestashop\modules\blockcart (or your templates custom cart module) and replace this:

 

 

//for every 'add' buttons...
$('.ajax_add_to_cart_button').unbind('click').click(function(){
var idProduct =  $(this).attr('rel').replace('ajax_id_product_', '');
if ($(this).attr('disabled') != 'disabled')
ajaxCart.add(idProduct, null, false, this);
return false;
})

 

with this:

 

//for every 'add' buttons...
$('.ajax_add_to_cart_button').unbind('click').click(function(){
var idProduct =  $(this).attr('rel').replace('ajax_id_product_', '');
if ($(this).attr('disabled') != 'disabled')
ajaxCart.add(idProduct, null, false, this,$('#quantity_wanted_'+ idProduct).val());
//alert($('#quantity_wanted_'+ idProduct).val());
return false;
});

 

 

If your shop is multilanguage, don't forget to translate 'Quantity:' in Front Office translations -> product-list

 

That's it!

[Blacksnipe]

hey Zahorijs,

 

I applied the code you described, and it works (amazing!). However, when I move to another page or reload the page, my cart is empty. What gives???

 

Blacksnipe

[Zahorijs]

I applied the code you described, and it works (amazing!). However, when I move to another page or reload the page, my cart is empty. What gives???

 

Sorry, mate, too much possibilities to guess the right one.

 

 

[raulaguilarv]

I can't make this code work in my shop. I tried everything, the template doesn't default, and it appears all but it doesn't take as the value of the text box (the amount of products, just take one product por click in add to cart). What Can I Do?

 

PLEASE HELP ME!

Edited May 20, 2013 by raulaguilarv (see edit history)

[sniff]

Hello raulaguilarv.

 

Did you solved this problem? I am struggling with the same.

 

I was also trying to use this:

 

alert($('#quantity_wanted_'+ idProduct).val());

 

for debugging purposes, but no alert appeared at all.

 

EDIT:

 

I solved my problem, I hope it will be solution to yours likewise.

 

I have not default theme installed. And this theme has its own ajax-cart.js file located in module catalog. (This theme requires also a couple of modules and one of them is: responsivetopbar. And this topbar has ajax cart, which is handled via responsivetopbar module not, default blockcart).

 

My advice: use totalcomander, or something similar to find all ajax-cart.js or (when you won't find such another file) for phrase: .ajax_add_to_cart_button (for example) in content of your shop files. Maybe you will find out that there is another file which handles adding products to your cart.

 

Hope this would help somebody in trouble.

Edited July 4, 2013 by sniff (see edit history)

[ssertoglu]

Hey ;

 

First of all thanks for all your help. Your are all great.

 

But there is a little problem which interests all of us.

 

This code is working on IE and Firefox but doesn't work on Chrome.

 

Still add only 1 product to the cart no matter what qty you enter.

 

Any ideas?

[ssertoglu]

And also does anybody have any idea about adding the box to the mobile template too?

[Paulito]

Good morning

 

If your struggling to add a quantity box to your product listing then have a read of this great tutorial

 

Here

 

Scroll down to almost the bottom and you will find it

 

Hope this helps

 

Paul

[greg barratt]

hi, no mattter which way i do it always passes quantity of 1 - on both explorer and chrome. i have changed all instances of ajax-cart.js..

 

any ideas???

[PrestaShark]

hi, no mattter which way i do it always passes quantity of 1 - on both explorer and chrome. i have changed all instances of ajax-cart.js..

 

any ideas???

 

Same here. Any hint?

[jjryeste]

Please is posible in prestahop 1.6 thank you