Jump to content

Modification dynamique du prix suivant la quantité via javascript (page produit)

Jérémie P.

By Jérémie P.
in Discussion générale

 Share

Recommended Posts

Jérémie P. Newbie

Jérémie P.

Posted
Posted

Bonjour,

J'avais besoin que le prix sur la fiche produit change instantanément suivant la quantité sélectionnée.
Utilisation d'une liste déroulante "quantité", plus pratique que le champ quantité à saisir. Fonctionne avec les réductions.

Ajout de la liste déroulante dans /themes/votre_theme/product.tpl

<!-- quantity wanted -->

quantity == 0) || $virtual} style="display:none;"{/if}>
{l s='Quantity :'}

1
2
3
4
5
6
7
8
9
10



Puis Ajout de la fonction JS "updatePrice()" à la dernière ligne du fichier /themes/votre_theme/js/product.js

//update price
function updatePrice()
{    
   var tax = noTaxForThisProduct ? 1 : ((taxRate / 100) + 1);
   var productPriceWithoutReduction2 = productPriceWithoutReduction * currencyRate;

   if (reduction_from != reduction_to && (currentDate > reduction_to || currentDate < reduction_from))
       var priceReduct = 0;
   else
       var priceReduct = productPriceWithoutReduction2 / 100 * parseFloat(reduction_percent) + (reduction_price * currencyRate);

   var priceProduct = productPriceWithoutReduction2 - priceReduct;
   var productPricePretaxed = (productPriceWithoutReduction2 - priceReduct) / tax;

   if (displayPrice == 1)
   {
       priceProduct = productPricePretaxed;
       productPriceWithoutReduction2 /= tax;
   }

   //get quantity
   var quantity_wanted = document.getElementById("quantity_wanted").value;
   var normal_price = productPriceWithoutReduction * parseInt(quantity_wanted);
   var new_price = priceProduct * parseInt(quantity_wanted);

   $('#our_price_display').text(formatCurrency(new_price, currencyFormat, currencySign, currencyBlank));
   $('#old_price_display').text(formatCurrency(normal_price, currencyFormat, currencySign, currencyBlank));
}



Fonctionne aussi sans liste déroulante, mais rajouter [i

  • Like 1
Link to comment
Share on other sites
vezy Newbie

vezy

Posted
Posted

Hello!
Et un grand merci pour cette contribution qui était exactement ce que je recherchais.
La liste déroulante marche parfaitement et c'est vrai que je trouve cela plus pratique. Cependant, j'ai ajouté le java pour le update du prix mais cela ne semble pas fonctionner pour moi... :down:
mes prix ont une réduction, est-ce la raison? Le code semble comprendre les deux bien que je ne comprends pas grand chose au java...
Une idée? Je suis en install locale avec le cache désactivé...
Cordialement,

Link to comment
Share on other sites
Jérémie P. Newbie

Jérémie P.

Posted
  • Author
Posted
Hello!
Et un grand merci pour cette contribution qui était exactement ce que je recherchais.
La liste déroulante marche parfaitement et c'est vrai que je trouve cela plus pratique. Cependant, j'ai ajouté le java pour le update du prix mais cela ne semble pas fonctionner pour moi... :down:
mes prix ont une réduction, est-ce la raison? Le code semble comprendre les deux bien que je ne comprends pas grand chose au java...
Une idée? Je suis en install locale avec le cache désactivé...
Cordialement,


Y'a pas de quoi! ;-)

Je viens de comprendre ton soucis. En fait cet éditeur m'a retiré un morceau de code (pour la sécurité je pense?) car il y a un appel "javascript" dans le onchange du select. Impossible de le faire apparaitre dans le code! Si un modérateur peux me confirmer?
Link to comment
Share on other sites
vezy Newbie

vezy

Posted
Posted

arghh, ça ne marche toujours pas... il manquerait pas une petite ligne de code aussi dans le JS par hasard...vu que parfois ça saute... Est ce que tu peux afficher un fichier contenant le texte java à rajouter également?
Ca serait top!
Merci encore! :-)

Link to comment
Share on other sites
vezy Newbie

vezy

Posted
Posted

Je suis super désolée... mais ça ne marche toujours pas ...

Je joins le fichier JS modifié des fois que -

Dans tous les cas, merci quand même - au moins un des deux marche pour moi. Je trouve cela d'ailleurs assez étonnant que cette modif dynamique ne fasse pas partie intégrée de PS.

Personne d'autre apparemment car je n'ai rien trouvé à ce sujet d'autre que ta proposition.

Moultes mercis

product.js

Link to comment
Share on other sites
Jérémie P. Newbie

Jérémie P.

Posted
  • Author
Posted
Je suis super désolée... mais ça ne marche toujours pas ...

Je joins le fichier JS modifié des fois que -

Dans tous les cas, merci quand même - au moins un des deux marche pour moi. Je trouve cela d'ailleurs assez étonnant que cette modif dynamique ne fasse pas partie intégrée de PS.

Personne d'autre apparemment car je n'ai rien trouvé à ce sujet d'autre que ta proposition.

Moultes mercis


Il est bon ton fichier, cette fonction est la même que moi et elle fonctionne bien.
Qu'est-ce que tu as mis dans ton fichier "product.tpl" ? Je pense que le soucis vient de ce fichier.
Je jette un oeil si tu veux.

a+
Link to comment
Share on other sites
Jérémie P. Newbie

Jérémie P.

Posted
  • Author
Posted
J'avais essayé de le joindre avec l'autre message sans succès - je ressaye...


J'ai compris ton soucis, tu n'as pas la version 1.2.5 car dans le fichier product.tpl il y a un ligne JS concernant l'affichage du prix ou non :

Donc en dessous de : 
var noTaxForThisProduct = {if $no_tax == 1}true{else}false{/if};



Rajoute : 

var displayPrice = {$priceDisplay};

Link to comment
Share on other sites
vezy Newbie

vezy

Posted
Posted

Jérémie P.!

Nickel! Tu es mon héros!
Moultes mercis pour ton aide - cela marche à merveille.

Pour ceux qui tenteront l'installation de cet outil bien utile sur leur thème moon:

Le thème Moon ainsi que tous les thèmes de dgcraft ont été conçus pour Prestashop 1.2.4. Si vous avez effectué l'installation de ces thèmes sur Prestashop 1.2.5, il est impératif de rajouter la ligne de code ci dessus à votre fichier product.tpl.

Un grand grand merci encore, c'est génial!

Link to comment
Share on other sites
Jérémie P. Newbie

Jérémie P.

Posted
  • Author
Posted
Jérémie P.!

Nickel! Tu es mon héros!
Moultes mercis pour ton aide - cela marche à merveille.

Pour ceux qui tenteront l'installation de cet outil bien utile sur leur thème moon:

Le thème Moon ainsi que tous les thèmes de dgcraft ont été conçus pour Prestashop 1.2.4. Si vous avez effectué l'installation de ces thèmes sur Prestashop 1.2.5, il est impératif de rajouter la ligne de code ci dessus à votre fichier product.tpl.

Un grand grand merci encore, c'est génial!


Y'a pas de quoi tout le plaisir était pour moi !
Bonnes ventes!
Link to comment
Share on other sites
  • 5 months later...
win83max Newbie

win83max

Posted
Posted

Bonjour,

Je viens de tester cette contribution, elle est fonctionnelle sur la 1.3 par contre celle-ci ne prend pas en compte les prix dégressifs.
Je vais voir entre deux travaux pour ajouter cela à ce code et le poste dès que je peux.

Cordialement.

Link to comment
Share on other sites
jcduss Newbie

jcduss

Posted
Posted

Bonjour,

J'ai essayé d'implanter ce code pour mon site web mais la fonction du prix dynamique ne fonctionne pas. J'ai regardé si j'avais bien var displayPrice et je l'ai.

Je suis avec la version 1.3, win83max est ce que tu as ajouté quelque chose par rapport au code de Jérémie?

Merci en tout cas pour cette contribution!

Link to comment
Share on other sites
julfrec Newbie

julfrec

Posted
Posted

Bonjour,

Merci pour ce thread qui m'a bien aide a implemente la liste deroulante de quantite et la mise a jour du prix. En revanche, je n'ai vu passer d'informations sur l'utilisation des prix degressifs.

Je vois qu'il est utilise dans l'ajout du produit au panier (this.priceByLine) mais je ne sais pas comment prendre en compte le tarif degressif dans mon prix produit affiche.

Finalement, on a un UpdatePrice qui renvoie un resultat different the priceByLine: le prix panier est different du prix produit ... pas cool.

Quelqu'un peut-il m'aider a implement UpdatePrice pour les prix degressifs?
Merci!

Link to comment
Share on other sites
julfrec Newbie

julfrec

Posted
Posted

Bonjour,

N'ayant pas reussi a debrouiller cet appel, je passe autrement:
- La quantite est bloque sur un
- Un groupe d'attribut "quantite" permet de choisir combien de produits sont souhaites.

Avantage: les prix sont a mis a jour en direct lors de la selection de la quantite
Desavantage: si vous avez beaucoup d'attributs qui modifie le prix, on se retrouve rapidement avec beaucoup de variations a corriger (un attribut qui coute 1 euro par produit coutera 10 pour 10 produits, donc a corriger a la main puisque quantite est maintenant un attribut)

Si quelqu'un trouve une solution confortable pour mettre a jour les prix degressifs par rapport a la quantite, je suis preneur!

Link to comment
Share on other sites
  • 4 weeks later...
  • 4 weeks later...
Yannkee Newbie

Yannkee

Posted
Posted

Bonjour, meme question, pas de maj du prix sur tarif degressif... (j'entends en relation avec ce qu'il y a deja dans le panier). Et j'aimerais recuperer le prix unitaire (apres la remise sur qte donc), pas le prix total, ou les deux eventuellement... Je cherche mais s'il y a une piste a ce sujet...


NB : pour faire avancer le post, j'ai passe le select dans une boucle, ce qui permettrait de passer les parametres dans des variables a definir dans un module ou autre...

{section name=foo start=1 loop=9 step=1}

           {$smarty.section.foo.index}

{/section}

Link to comment
Share on other sites
  • 7 months later...
dradisso Newbie

dradisso

Posted
Posted

Bonjour,
Pour info, j'ai adapté le javascript pour la version 1.4. La modif du fichier product.tpl reste inchangée



//update price
function updatePrice()
{    
   var tax = noTaxForThisProduct ? 1 : ((taxRate / 100) + 1);
           var productPriceWithoutReduction = productPriceTaxExcluded + selectedCombination['price'] * currencyRate;
   var productPriceWithoutReduction2 = productPriceWithoutReduction * currencyRate;

   var priceReduct = productPriceWithoutReduction2 / 100 * parseFloat(reduction_percent) + (reduction_price * currencyRate);

   var priceProduct = productPriceWithoutReduction2 - priceReduct;
   var productPricePretaxed = (productPriceWithoutReduction2 - priceReduct) / tax;

   if (displayPrice == 1)
   {
       priceProduct = productPricePretaxed;
       productPriceWithoutReduction2 /= tax;
   }

   //get quantity
   var quantity_wanted = document.getElementById("quantity_wanted").value;
   var normal_price = productPriceWithoutReduction * parseInt(quantity_wanted);
   var new_price = priceProduct * parseInt(quantity_wanted);

   $('#our_price_display').text(formatCurrency(new_price, currencyFormat, currencySign, currencyBlank));
   $('#old_price_display').text(formatCurrency(normal_price, currencyFormat, currencySign, currencyBlank));
}

Link to comment
Share on other sites
flobidouze Newbie

flobidouze

Posted
Posted

Génial merci!!

Mais j'aimerais savoir si il est possible d'avoir dans la liste déroulante qu'il affiche réellement les quantités en stock car des fois je propose 50 QT et d'autre fois 10 et j'ai du ajouter 50 QT dans mon product tpl mais peut il sadpater suivant les Qt dispo .
puis pareil pour moi la mise a jour du prix ne fonctionne pas..

Sinon parfait merci à toi ;)

Link to comment
Share on other sites
dradisso Newbie

dradisso

Posted
Posted

Un petit up pour une correction du script précédent. Attention, cette modif ne gère pas les promotions temporaires. Je vais essayer de résoudre ce pb plus tard.

//update price
function updatePrice()
{    
   var tax = noTaxForThisProduct ? 1 : ((taxRate / 100) + 1);
   var productPriceWithoutReduction = productPriceTaxExcluded + selectedCombination['price'] * currencyRate;
   var productPriceWithoutReduction2 = productPriceWithoutReduction * currencyRate;

   var priceReduct = productPriceWithoutReduction2 / 100 * parseFloat(reduction_percent) + (reduction_price * currencyRate);

   var priceProduct = productPriceWithoutReduction2 - priceReduct;
   var productPricePretaxed = (productPriceWithoutReduction2 - priceReduct) / tax;


   if (displayPrice == 1)
   {
       priceProduct = parseFloat(productPricePretaxed*tax);
       productPriceWithoutReduction2 /= tax;
   }

   //get quantity
   var quantity_wanted = document.getElementById("quantity_wanted").value;
   var normal_price = productPriceWithoutReduction * parseInt(quantity_wanted);

   if (productPriceTaxExcluded==productPriceWithoutReduction) {
   var new_price = priceProduct * parseInt(quantity_wanted);
   }else{
   var new_price = productPriceTaxExcluded * parseInt(quantity_wanted);
   }

   $('#our_price_display').text(formatCurrency(new_price, currencyFormat, currencySign, currencyBlank));
   $('#old_price_display').text(formatCurrency(normal_price, currencyFormat, currencySign, currencyBlank));
}

Link to comment
Share on other sites
  • 2 weeks later...
  • 5 months later...
  • 3 weeks later...
dradisso Newbie

dradisso

Posted
Posted

Re-bonjour à tous, {Oups, le temps a passé !}

Désolé, mais la seule façon que j'aie trouvé de gérer les prix dégressifs est de les coder en dur dans le script, à partir de tableaux. J'espère que les prochaines màj de presta vont intégrer cela.

Link to comment
Share on other sites
  • 4 weeks later...
  • 2 weeks later...
  • 2 months later...
  • 2 weeks later...
prestabug Newbie

prestabug

Posted
Posted

Bonjour!

J'ai vu qu'il y avait une option prix degressifs dans le backoffice d'une ancienne version de prestashop, mais impossible de la retrouver dans ma versio 1.4.7, est ce normal, cette option a-t-elle disparu avec cette nouvelle version?

Ou est-ce dû à un nouveau thème installé ?

 

J'aurais souhaité pouvoir indiquer des prix en pourcentage ( + ou - ) en fonction des quantités, comment dois-je m'y prendre?

(merci de m'indiquer ou poster cette demande si cela ne convient pas à cette discussion..)

Link to comment
Share on other sites
  • 1 month later...
Smoosies Newbie

Smoosies

Posted
Posted

Bonjour,

 

Je voudrais juste remercier pour le code, et préciser que j'ai trouvé une solution pour prendre en compte les prix dégressifs suivant les options. C'est une solution pas très belle et peut être que quelqu'un trouvera une autre solution :

 

- j'ai gardé la span '#our_price_display' et j'ai créé une seconde en dessous #global_price_display, je ne perd donc pas le prix unitaire de base avec les options.

- quand on rentre une nouvelle quantité je multiplie donc la quantité par le prix unitaire indiqué par prestashop et je l'affiche dans #global_price_display.

 

Au choix on cache le prix unitaire ou on l'affiche pour le rappeler au client.

Link to comment
Share on other sites
  • 1 year later...
  • 5 months later...
comxcom Newbie

comxcom

Posted
Posted (edited)

Bonjour tout le monde :-)

Je vais tester la dernière version de ce code sur mon projet de boutique en ligne (v.1.5.6) et je vous dirai s'il fonctionne, ce serait vraiment top !

 

Edit =>

Bon bin je suis super déçue, ça marche pô du tout, ça fait un tas d'erreurs !  :(

C'est nul, d'être nulle !

Bref, si vous n'êtes pas dév et que vous avez une boutique sous PS156, ce code risque de ne pas vous être d'une grande utilité !

Edited by comxcom (see edit history)
Link to comment
Share on other sites
  • 2 months later...
  • 1 year later...
makinero Rookie

makinero

Posted
Posted

Je n'avais pas trop d'espoir que ça marche, j'ai quand même testé mais ça ne marche évidemment pas sur un PS 1.6.0.9, est-ce que quelqu'un a réussi à l'adapter sur la 1.6 ?

 

Encore une bonne idée de fonctionnalité de base à ajouter dans le core. ^_^

Link to comment
Share on other sites
  • 1 month later...
neoprint Newbie

neoprint

Posted
Posted

Je n'avais pas trop d'espoir que ça marche, j'ai quand même testé mais ça ne marche évidemment pas sur un PS 1.6.0.9, est-ce que quelqu'un a réussi à l'adapter sur la 1.6 ?

 

Encore une bonne idée de fonctionnalité de base à ajouter dans le core. ^_^

+1

Link to comment
Share on other sites
  • 6 months later...
  • 1 month later...
  • 2 weeks later...
Quentin_E Newbie

Quentin_E

Posted
Posted

Bonjour,

 

J'ai été confronté au problème, j'ai créé un module qui permet la "Modification dynamique du prix suivant la quantité" or il ne prend pas encore en compte les prix dégressifs sur la quantité mais pour ceux qui ne veulent pas s'embêter avec le code voici le lien :

https://www.prestashop.com/forums/topic/483105-module-gratuit-affichage-prixquantit%C3%A9/

 

J’espère qu’il sera utile à certains ^_^ .

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share
Go to topic listing
×
×
  • Create New...