Jump to content

Botones +/- incrementar cantidad en pag.producto


Imative

Recommended Posts

Buenas Tardes a tod@s,

 

Me gustaría incorporar los botones de "aumentar y disminuir cantidad" en la "Pagina del Producto" tal y como aparecen en el "Resumen del Carrito".

 

He buscado algún modulo o topic referente a este tema pero no he encontrado nada, ¿ sabe alguien como hacerlo ? Creo que nos ayudaría mucho a incentivar la compra de más productos.

 

-----------------------------------------

Prestashop version 1.4.8.2

post-386123-0-73960300-1359058691_thumb.png

post-386123-0-28445900-1359058708.png

Link to comment
Share on other sites

  • 2 months later...

Buenas Tardes a tod@s,

 

Me gustaría incorporar los botones de "aumentar y disminuir cantidad" en la "Pagina del Producto" tal y como aparecen en el "Resumen del Carrito".

 

He buscado algún modulo o topic referente a este tema pero no he encontrado nada, ¿ sabe alguien como hacerlo ? Creo que nos ayudaría mucho a incentivar la compra de más productos.

 

-----------------------------------------

Prestashop version 1.4.8.2

 

Hola a tod@s,

 

Conseguiste poner los botones para aumentar y disminuir las cantidades de los productos? Estoy muy interesado para hacer lo mismo.

 

Un saludo,

 

Julio

Link to comment
Share on other sites

Mañana si tengo un rato le echo un vistazo...

 

Saludos

 

Muchas gracias Statictic...

 

Yo también creo que sería muy interesante, sobre todo para tiendas en las que no se van a comprar productos en grandes cantidades, ya que sin necesidad del teclado puedes aumentar las unidades de compra. En definitiva creo que ayuda en el proceso de la compra.

 

Un saludo,

 

Julio

Link to comment
Share on other sites

Buenas Tardes a tod@s,

 

Me gustaría incorporar los botones de "aumentar y disminuir cantidad" en la "Pagina del Producto" tal y como aparecen en el "Resumen del Carrito".

 

He buscado algún modulo o topic referente a este tema pero no he encontrado nada, ¿ sabe alguien como hacerlo ? Creo que nos ayudaría mucho a incentivar la compra de más productos.

 

-----------------------------------------

Prestashop version 1.4.8.2

 

Hola,

 

Ya lo he conseguido.

 

En el archivo product.tpl debes poner el siguiente código en la parte que hace referecia a <!-- quantity wanted -->:

 

 

<!-- quantity wanted -->

<p id="quantity_wanted_p"{if (!$allow_oosp && $product->quantity <= 0) OR $virtual OR !$product->available_for_order OR $PS_CATALOG_MODE} style="display: none;"{/if}>

<label>{l s='Quantity:'}</label>

<a class="cart_quantity_down" href="javascript:{}" onclick="changeQuantity(1,1);"><img width="14" height="9" alt="sustraer" src="themes/default/img/icon/quantity_down.gif"></img></a>

<input type="text" name="qty" id="quantity_wanted" class="text" value="{if isset($quantityBackup)}{$quantityBackup|intval}{else}{if $product->minimal_quantity > 1}{$product->minimal_quantity}{else}1{/if}{/if}" size="2" maxlength="3" {if $product->minimal_quantity > 1}onkeyup="checkMinimalQuantity({$product->minimal_quantity});"{/if} />

<a class="cart_quantity_up" href="javascript:{}" onclick="changeQuantity(1,2);"><img width="14" height="9" alt="Añadir" src="themes/default/img/icon/quantity_up.gif"></img></a></p>

 

Luego debes añadir la siguiente función en el archivo product.js

 

 

function changeQuantity(minimal_quantity, operator)

{

if (operator == 1) //subtract

$('#quantity_wanted').val($('#quantity_wanted').val()*1 - 1);

else if (operator == 2) //sum

$('#quantity_wanted').val($('#quantity_wanted').val()*1 + 1);

checkMinimalQuantity(minimal_quantity);

}

 

Si tienes cualquier duda me dices...

 

Saludos,

Edited by jmolpea (see edit history)
  • Like 2
Link to comment
Share on other sites

  • 2 months later...

Hola, primero que todo me aprovecho de presentar, mi nombres es Nicolás y ayer por primera vez instale Prestashop pues necesito hacer un sitio de ventas para mi madre, hasta ahora me ha ido muy bien haciendo las modificaciones que requiero apoyado por las múltiples resoluciones a problemas que hay en el foro. También me disculpo si lo correcto hubiese sido crear un nuevo tema, pero mi duda está muy relacionada con la solución aquí presentada y que he implementado sin problemas.

 

Resulta que me gustaría aplicar ésto mismo para aumentar la cantidad de productos en una lista de éstos, hasta ahora habpia hecho lo siguiente para poder agregar la cantidad de productos con el teclado.

 

Agregé esto después de la zona de precio product-list.tlp;

 

{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" />

 

Y modifiqué ajax-cart.js de prestashop\modules\blockcart ;

 

Sustituí ésto;

 

//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;
})

 

Con ésto;

 

//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;
});

 

Ésto funciono a la perfección pero cuando vi éste tema traté de agregarle los botones para comodidad del usuario, por lo que traté de mezclar ésto;

 

{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" />

 

Con el código acá expuesto;

 

<p id="quantity_wanted_p"{if (!$allow_oosp && $product->quantity <= 0) OR $virtual OR !$product->available_for_order OR $PS_CATALOG_MODE} style="display: none;"{/if}>
<label>{l s='Quantity:'}</label>
<a class="cart_quantity_down" href="javascript:{}" onclick="changeQuantity(1,1);"><img width="14" height="9" alt="sustraer" src="themes/default/img/icon/quantity_down.gif"></img></a>
<input type="text" name="qty" id="quantity_wanted" class="text" value="{if isset($quantityBackup)}{$quantityBackup|intval}{else}{if $product->minimal_quantity > 1}{$product->minimal_quantity}{else}1{/if}{/if}" size="2" maxlength="3" {if $product->minimal_quantity > 1}onkeyup="checkMinimalQuantity({$product->minimal_quantity});"{/if} />
<a class="cart_quantity_up" href="javascript:{}" onclick="changeQuantity(1,2);"><img width="14" height="9" alt="Añadir" src="themes/default/img/icon/quantity_up.gif"></img></a></p>

 

Teniendo como resultado ésto;

 

<label>{l s='Cantidad:'}</label>
<a class="cart_quantity_down" href="javascript:{}" onclick="changeQuantity(1,1);"><img width="14" height="9" alt="sustraer" src="themes/default/img/icon/quantity_down.gif"></img></a>
<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}{if $product->minimal_quantity > 1}{$product->minimal_quantity}{else}1{/if}{/if}" size="2" maxlength="3" {if $product->minimal_quantity > 1}onkeyup="checkMinimalQuantity({$product->minimal_quantity});"{/if} />
<a class="cart_quantity_up" href="javascript:{}" onclick="changeQuantity(1,2);"><img width="14" height="9" alt="Añadir" src="themes/default/img/icon/quantity_up.gif"></img></a></p>

 

Lo cual me permite cambiar la cantidad con el teclado como antes, sin embargo los botones están pero no funcionan. He metido harta mano pero no he dado con la solución, me da la impresión de que tal ves me falta agregar algo para poder llamar correctamente a la función de product.js, alguien me puede guiar sobre como hacerlo funcionar. Desde ya muchas gracias, y espero poder ayudar yo también ahora que soy usuario. Saludos, Nicolás.

Link to comment
Share on other sites

Por si a alguien le sirviera, lo solucioné asi:

 

Agregando esto al comienzo de \themes\"sutema"\product-list.tpl

 

<script type="text/javascript">
function checkMinimalQuantity(id,minimal_quantity)
{
if ($('#'+id).val() < minimal_quantity)
{
 //$('#'+id).css('border', '1px solid red'); eliminar cambio cuadro a color rojo.
 //$('#minimal_quantity_wanted_p').css('color', 'red');
 $('#'+id).val(minimal_quantity);
}
else
{
 $('#'+id).css('border', '1px solid #BDC2C9');
 //$('#minimal_quantity_wanted_p').css('color', '#374853');
}
}
function changeQuantityList(id,minimal_quantity, operator)
{
if (operator == 1) //subtract
$('#'+id).val($('#'+id).val()*1 - 1);
else if (operator == 2) //sum
$('#'+id).val($('#'+id).val()*1 + 1);
checkMinimalQuantity(id,minimal_quantity);
}
</script>

 

Y agregando ésto donde quieren tener el cuadro con la cantidad y los botones, en mi caso por <div class="content_price">

 

<label>{l s='Cantidad:'}</label>
<a class="cart_quantity_down" href="javascript:{}" onclick="changeQuantityList(quantity_wanted_{$product.id_product|intval}.id,1,1);"><img width="14" height="9" alt="sustraer" src="themes/default/img/icon/quantity_down.gif"></img></a>
<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}{if $product->minimal_quantity > 1}{$product->minimal_quantity}{else}1{/if}{/if}" size="2" maxlength="3" {if $product->minimal_quantity > 1}onkeyup="checkMinimalQuantity({$product->minimal_quantity});"{/if} />
<a class="cart_quantity_up" href="javascript:{}" onclick="changeQuantityList(quantity_wanted_{$product.id_product|intval}.id,1,2);"><img width="14" height="9" alt="Añadir" src="themes/default/img/icon/quantity_up.gif"></img></a></p>

Edited by nguerra (see edit history)
Link to comment
Share on other sites

Guest
This topic is now closed to further replies.
×
×
  • Create New...