[ASTUCE] Personnalisation d’un produit et commande en un seul clic

Michel Poulain · December 11, 2010

Je ne savais pas dans quelle catégorie poster ce message. Mais je tenais à partager ce code qui peut aider d'autres personnes ayant le même problème avec Prestashop. Une cliente refusait de payer, tant que ce problème avec Prestashop n'était pas réglé. Ce problème peut donc être important aux yeux d'autres responsables de boutiques sous Prestashop.

Le problème : la personnalisation des produits fait perdre les options choisies des produits à commander en provoquant un retour sur la page produit (seule la quantité des produits est conservée). Le client doit donc à nouveau choisir les options des produits à commander avant de passer commande.

Second problème : trouver une solution sans toucher au cœur de Prestashop pour permettre des mises à jour.

La solution : personnalisation et commande des produits en un seul clic grâce à jQuery.

Pour expliquer ce que j'ai fait : à chaque envoi d'une commande, le navigateur récupère les valeurs (URL de validation et les noms des champs à envoyer), puis poste le premier formulaire en Ajax. Après la réponse du serveur pour la personnalisation, il autorise le second formulaire de commande à être envoyé. Tout ce processus n’apparaît que si le formulaire de personnalisation est présent sur la page. Ceci fonctionne avec le thème générique de Prestashop, mais peut être facilement adapté à tous les thèmes.

Voilà. J'espère que cela pourra servir à d'autres utilisateurs de Prestashop.

Ce script Javascript doit être intégré dans le pied de page du site dans le template « footer.tpl » (ceci explique la présence des balises {literal} pour indiquer à Smarty de ne pas toucher au Javascript).

{literal}

$(function() {

 if($('#customizationForm').length) {

   $('#center_column').html('' + $('#center_column').html().replace("cliquez sur Enregistrer puis", '') + '');
   $('#customizationForm input:last').css({'display':'none'});
   $('#customizationForm').submit(function() { return false; });

   jQuery.data(document.body, 'personnalisation', ($('#customizationForm input:eq(0)').val()=='' ) ? false : true);

   $('#buy_block').submit(function() {

     if (jQuery.data(document.body, 'personnalisation')) return true;

     $.ajax({
       url: $('#customizationForm').attr('action'),
       global: false,
       type: 'POST',                
       data: 'quantityBackup=0&submitCustomizedDatas=1&'+$('#customizationForm input:eq(0)').attr('name')+'='+$('#customizationForm input:eq(0)').val(),
       dataType: 'html',
       async:false,
       success: function(msg){
         jQuery.data(document.body, 'personnalisation', true);
         $('#buy_block').submit();
       }
     })

     return false;

   });
 }

});

{/literal}

Topic déplacé (merci pour la contrib) -yoya971

redtango2 · December 14, 2010

Testé sur PS 1.3.3.

Fonctionne Nickel
Bravo pour cette fonction super utile !

Michel Poulain · December 14, 2010

Testé sur PS 1.3.3. Fonctionne Nickel
Bravo pour cette fonction super utile !

Content que ce bout de code soit utile pour d'autres personnes. J'avoue que je n'ai pas compris l'intérêt de la perte complète des options lors d'une commande personnalisée. Encore une volonté de Prestashop qui m'échappe... ;-)

[email protected] · January 4, 2011

Question bête, il se trouve où votre footer.tpl?

Merci pour votre aide
Valerie

Michel Poulain · January 4, 2011

Le « footer.tpl » se trouve dans le dossier de votre thème. Par exemple : /themes/prestashop/footer.tpl

[email protected] · January 4, 2011

Merci pour votre réponse rapide, par contre je n'ai pas trouvé de balise {litéral}.
Donc j'ai intégré votre code en dessous de tout et j'ai comme message sur le site

$(function() { if($('#customizationForm').length) { $('#center_column').html('
' + $('#center_column').html().replace("cliquez sur Enregistrer puis", '') + '
'); $('#customizationForm input:last').css({'display':'none'}); $('#customizationForm').submit(function() { return false; }); jQuery.data(document.body, 'personnalisation', ($('#customizationForm input:eq(0)').val()=='' ) ? false : true); $('#buy_block').submit(function() { if (jQuery.data(document.body, 'personnalisation')) return true; $.ajax({ url: $('#customizationForm').attr('action'), global: false, type: 'POST', data: 'quantityBackup=0&submitCustomizedDatas=1&'+$('#customizationForm input:eq(0)').attr('name')+'='+$('#customizationForm input:eq(0)').val(), dataType: 'html', async:false, success: function(msg){ jQuery.data(document.body, 'personnalisation', true); $('#buy_block').submit(); } }) return false; }); } });

Que dois-je faire ?

Merci,
Val

[email protected] · January 4, 2011

Voici le contenu de ce footer.tpl

{if !$content_only}

{$HOOK_RIGHT_COLUMN}

{$HOOK_FOOTER}

{/if}

</body>
</html>

Jacques Biais · January 4, 2011

A l'attention de [email protected].

Lorsque l'on place du code javascript dans un TPL, smarty tente d'interpréter ce code et très souvent le résultat est déplorable (plus d'affichage, affichage tronqué etc etc)
Il existe donc la balise {literal}. La présence de cette balise dans un code javascript ou même un CSS fait que smarty ignorera tout ce qui est placé à l'intérieur de cette balise, et le code sera interprété normalement à l'ouverture de la page.
La balise: {literal}{/literal}
literal sans accent sur le e.

Cordialement.

[email protected] · January 5, 2011

merci pour vos explications, je me lance et vais suivre vos explications à la lettre.

Valérie

Michel Poulain · January 5, 2011

Valérie, il serait important de vous tourner vers un développeur. Car le code Javascript que j'ai donné, et qui fonctionne très bien, doit être mis entre balise < script > dans le code HTML. Je ne peux pas donner le code exact via ce forum car le forum supprime ces balises.

fabbea · February 3, 2011

Bonjour Michel,

et merci pour l'initiative, très utile ! C'est vrai que ce devrait être incorporé d'office dans Prestashop, cette double validation pouvant être source d'erreur sie le client ne fait pas attention à tous ces champs et ses pertes d'options.

J'ai inséré ce code comme il se doit, le bouton de validation des personnalisations disparaît bel et bien, seulement quand j'ajoute le produit au panier, l'erreur suivante m'est renvoyée :

01.Merci de remplir tous les champs, ensuite enregistrez votre personnalisation
C'est l'erreur qui s'affiche lorsque l'on n'a pas rempli tous les champs personnalisation. Donc apparemment ces champs ne sont pas bien transmis dans mon cas.

JE continue également à perdre les infos quantités et attributs sélectionnés (taielle, couleur etc...).
Une idée ? je suis sur Prestashop 1.3.2.

Amicalement

Michel Poulain · February 3, 2011

01.Merci de remplir tous les champs, ensuite enregistrez votre personnalisation
C'est l'erreur qui s'affiche lorsque l'on n'a pas rempli tous les champs personnalisation. Donc apparemment ces champs ne sont pas bien transmis dans mon cas.

Justement, j'ai fait une mise à jour pas plus tard qu'hier soir, suite à un même problème. Le souci venait du fait que mon script ne prenait en compte qu'un seul attribut de personnalisation. Voici le nouveau script qui prend en compte autant d'attributs de personnalisation qu'en comporte la page produit.

Attention Le nouveau script mis en place, l'erreur persistera tant que les Cookies ne sont pas vidés. Nous l'avons testé. Les cookies restent pendant plusieurs semaines chez les visiteurs. L'astuce est donc de vider les cookies des visiteurs, et donc l'ancienne valeur de personnalisation, en changeant la valeur du "_COOKIE_KEY_" dans /config/settings.inc.php Il suffit de changer une lettre par un chiffre, ça fera l'affaire.

$(document).ready(function() {

 if($("#customizationForm").length) {

   //$('#center_column').html("" + $('#center_column').html().replace("cliquez sur Enregistrer puis", "") + "");
   $('#customizationForm input:last').css({'display':'none'});
   $('#customizationForm').submit(function() { return false; });

   jQuery.data(document.body, 'personnalisation', ($("#customizationForm input:eq(0)").val()=='' ) ? false : true);

   $("#buy_block").submit(function() {

     if($('#customizationForm input:eq(0)').val()=='') {
       alert('Attention, vous devez personnaliser ce produit avant de le commander.');
       $('#customizationForm input:eq(0)').focus();
       return false;
     }

     if (jQuery.data(document.body, 'personnalisation')) return true;

     var temp = 'quantityBackup=0&submitCustomizedDatas=1';

     $("#customizationForm input.customization_block_input").each(function(){
         temp += '&'+$(this).attr('name')+'='+encodeURIComponent($(this).val());
     });

     $.ajax({
       url: $('#customizationForm').attr('action'),
       global: false,
       type: "POST",                
       data: temp,
       dataType: "html",
       async: false,
       success: function(msg){
         jQuery.data(document.body, 'personnalisation', true);
         $("#buy_block").submit();
       }
     })

     return false;

   });
 }

});

fabbea · February 3, 2011

Quelle réactivité ! Magnifique !

j'ai testé :
Ca marche si le client oublie de remplir TOUS LES CHAMPS.
Par contre s'il n'en oublie qu'un (sur 2 ou plus) on se retrouve avec le même problème...

Michel Poulain · February 3, 2011

En fait, le problème n'est pas le même, car c'est le fonctionnement natif de Prestashop : quand un champ est manquant, un message d'erreur apparait. Mais si tous les champs sont remplis, l'étape de retour sur la page est supprimé (ce qui est le but du script).

Voici une nouvelle version du script qui vérifie les champs obligatoires.

$(document).ready(function() {

 var ids = new Array();
 $("#customizationForm input.customization_block_input").each(function(){
     ids.push($(this).attr("id"));
 });

 if($("#customizationForm").length) {

   //$('#center_column').html("" + $('#center_column').html().replace("cliquez sur Enregistrer puis", "") + "");
   $('#customizationForm input:last').css({'display':'none'});
   $('#customizationForm').submit(function() { return false; });

   jQuery.data(document.body, 'personnalisation', false);

   $("#buy_block").submit(function() {

     if (jQuery.data(document.body, 'personnalisation')) return true;

     var temp = 'quantityBackup=0&submitCustomizedDatas=1';

     for(var w=0; w        temp += '&'+$('#'+ids[w]).attr('name')+'='+encodeURIComponent($('#'+ids[w]).val());
       if($('#'+ids[w]).parent().hasClass('required') && $('#'+ids[w]).val()=='') {
         alert('Attention, vous devez personnaliser ce produit avant de le commander.');
         $('#'+ids[w]).focus();
         return false;
       }
     }

     $.ajax({
       url: $('#customizationForm').attr('action'),
       global: false,
       type: "POST",                
       data: temp,
       dataType: "html",
       async:false,
       success: function(msg){
         jQuery.data(document.body, 'personnalisation', true);
         $("#buy_block").submit();
       }
     })

     return false;

   });
 }

});

fabbea · February 3, 2011

C'est le top ! Ca mérite une médaille
Ca marche nickel, génial et un grand merci !

Michel Poulain · February 3, 2011

Merci, ça fait plaisir.

C'est comme cela, je trouve, que le panier personnalisé de Prestashop devrait nativement fonctionner.

fabbea · February 3, 2011

Oui, je pense aussi.
C'est tellement plus logique.

b2comm · February 18, 2011

A tout hasard... je relance le post.

Apparemment quand j'active le panier en mode ajax (module Block Cart avec panier activé), petit souci :

mon enregistrement de la personnalisation du produit n'est pas prise en compte bien que j'ai bien rempli les champs, car le module blockcart m'envoie une boite de dialogue disant : "merci de remplir tous les champs, ensuite enregistrez votre personnalisation".
A partir de là, tout est bloqué au niveau ajout panier, y compris la commande sur d'autres produits même sans personnalisation.

Le souci, c'est qu'ayant le module chèque cadeau (ou gift voucher qui fonctionne avec blockCart en ajax) j'ai besoin de l'activer.

Y a t'il moyen de contourner le problème ?

Amicalement

Michel Poulain · February 21, 2011

Bonjour b2comm. Merci pour ce retour. Effectivement cette rustine Ajax n'a pas été testée avec le module Block Cart activé.

Pour tout dire, je ne connaissais pas ce module. J'ai vraiment du mal à comprendre le pourquoi du comment de ce fonctionnement bizarroïde. D'où cette rustine "commande et personnalisation en un clic". Par contre, contrairement à Drupal, d'où je viens, Prestashop n'est pas conçu pour être détourné facilement. Surtout en JavaScript. Je vais voir ce que je peux faire, mais rien n'est sûr, car les deux comportements Ajax risquent de se télescoper.

StoreCommander · February 21, 2011

Bonjour,

Merci à Michel Poulain pour cette astuce, testée et mise en ligne mais le site n'a pas le module BlockCart.

Peut être qu'il suffit d'utiliser un .unbind() sur le bouton au début du code et d'appeler updateDisplay(); (product.js) au retour de la 2eme requête...

Michel Poulain · February 21, 2011

Merci pour l'astuce PShopExpert. Je vais tester tout cela.

b2comm · February 21, 2011

Bonjour

merci en tous cas déjà pour l'intérêt que vous portez tous les deux à ma requête.
Ce forum est incroyable, il y règne vraiment une bonne volonté qui fait plaisir.

b2comm · February 24, 2011

Bonjour

un petit up.
Rien de nouveau concernant le problème avec le panier Ajax ? Peut-être n'est ce pas possible ?

Amicalement

Michel Poulain · February 24, 2011

Désolé, je n'ai pas eu le temps de travailler dessus. Il faut que j'installe une boutique de test avec un panier Ajax. Ma boutique n'a pas de panier Ajax. Puis que je travaille sur le script.

Repitol · March 2, 2011

Bonjour,
Voilà un truc qui m'intéresse grandement, mas je n'arrive pas à le faire fonctionner.
j'ai mis le code (le dernier affiché) dans footer.tpl entre des balises "script" et "/script" (dans leurs crochets), juste avant la balise "/body".

malheureusement, lors d'une personnalisation avec une image, le client ne peut pas charger son fichier jpg car il n'y a plus de bouton "envoyer".

Merci de votre aide.

Michel Poulain · March 2, 2011

Bon, là ça commence à faire beaucoup d'inconnues. Le mieux serait encore que l'équipe de Prestashop implémente ça directement à la base. Mais on peut rêver... :-(

Repitol · March 2, 2011

Je comprends...
Déjà, si on arrivait à déplacer la zone de personnalisation pour la mettre avant le choix des déclinaisons, ce serait pour le client moins perturbant.
Mais là, je bute sur la méthode. Impossible de voir dans quel fichier php ça se joue.

Michel Poulain · March 2, 2011

Pas évident de mettre le nez dans le code Prestashop. Venant de Drupal, où la documentation est très bien ficelée et claire, là je tombe dans la nuit noire.

Toucher au code n'est jamais bon. À chaque mise à jour, tout est à refaire, avec en prime la possibilité que les noms des fonctions changent.

Je pensais mon code de personnalisation de panier "universel" JavaScript, je vois qu'il ne l'est pas. Si de bonnes âmes (codeurs) pouvaient prendre le relais, ils ont une bonne base pour commencer.

C'est vrai que mon code n'est pas du tout fait pour le chargement de fichiers. Désolé.

Pour le panier Ajax, ça semble plus facile de modifier, mais il faudrait que j'aie une installation propre avec Panier Ajax pour pouvoir jouer avec le code.

Repitol · March 2, 2011

Pas grave, car l'astuce est déjà super sans l'envoi de fichiers.
J'ai trouvé comment déplacer la zone de personnalisation, c'est dans le product.tpl.
Il faut déplacer toute la zone "Product customization" jusqu'à l'avant dernier {/if} vers une autre position.

StoreCommander · March 11, 2011

Bonjour,

Quelques pistes pour l'upload de fichiers :

http://www.fyneworks.com/jquery/multiple-file-upload/
http://www.malsup.com/jquery/form/#file-upload

Malheureusement je n'ai pas assez de temps pour continuer.

Repitol · March 15, 2011

pour déplacer la zone de personnalisation, voir l'excellente astuce et méthode décrites ici.
C'est une solution de secours, mais ça a l'avantage d'être plus cohérent pour le client...

http://www.prestashop.com/forums/viewthread/78714/developpement/modifier_zone_de_personnalisation_produit

Bon travail à tous

干将ooo · May 23, 2011

Merci Michel Poulain pour l'astuce très utile.

J'ai juste modifié un peu la fichier ajax_cart.js pour ça marche en mode AJAX panier.

remplace

$('body#product p#add_to_cart input').unbind('click').click(function(){    
ajaxCart.add( $('#product_page_product_id').val(), $('#idCombination').val(), true, null, $('#quantity_wanted').val(), null,$("#group_4").val());
return false;
});

par

$('body#product p#add_to_cart input').unbind('click').click(function(){    

           var ids = new Array();
           $("#customizationForm textarea.customization_block_input").each(function(){
               ids.push($(this).attr("id"));
           });    


             var temp = 'quantityBackup=0&submitCustomizedDatas=1';

             for(var w=0; w                temp += '&'+$('#'+ids[w]).attr('name')+'='+encodeURIComponent($('#'+ids[w]).val());
             }

             $.ajax({
               url: $('#customizationForm').attr('action'),
               global: false,
               type: "POST",                
               data: temp,
               dataType: "html",
               async:false,
               success: function(msg){
                 ajaxCart.add( $('#product_page_product_id').val(), $('#idCombination').val(), true, null, $('#quantity_wanted').val(), null,$("#group_4").val());                
               }
             })

             return false;    
       });

Michel Poulain · May 23, 2011

C'est génial. Merci 干将ooo. C'est b2comm qui attendait cela depuis un moment.

干将ooo : est-ce qu'il serait possible d'avoir la totalité du script avec la modification pour l'Ajax dedans ?

b2comm · May 23, 2011

Bonjour

effectivement Michel, j'avais finalement combiné et désactivé l'ajax quand même parce-que cette fonctionnalité panier en 1 clic est trop utile à mes yeux, mais si on peut combiner les deux !
Vous êtes des champions, j'essaie ça dès que je peux.
PS pour 干将ooo : est-ce que c'est susceptible de marcher aussi sur les versions Prestashop 1.4 (c'est juste une question, pas une "exigence" supplémentaire) ?

Bien amicalement

干将ooo · May 24, 2011

C'est génial. Merci 干将ooo. C'est b2comm qui attendait cela depuis un moment.

干将ooo : est-ce qu'il serait possible d'avoir la totalité du script avec la modification pour l'Ajax dedans ?

Ci-join, ma fichier /modules/blockcart/ajax_cart.js. dans la fichier, les modifications sont entre les deux commendaires:
/*modif begin*/
.................
/*modif end*/

ajax-cart.js

干将ooo · May 24, 2011

Bonjour

effectivement Michel, j'avais finalement combiné et désactivé l'ajax quand même parce-que cette fonctionnalité panier en 1 clic est trop utile à mes yeux, mais si on peut combiner les deux !
Vous êtes des champions, j'essaie ça dès que je peux.
PS pour 干将ooo : est-ce que c'est susceptible de marcher aussi sur les versions Prestashop 1.4 (c'est juste une question, pas une "exigence" supplémentaire) ?

Bien amicalement

Je testais ça sous la version PrestaShop™ 1.4.1.0 .

Michel Poulain · May 24, 2011

Génial. Merci.

huner · May 24, 2011

Bonjour,

Je suis sur la version 1.4.0.17 et en applicant les modifications je vois bien l'image produit "s'envolé" vers le panier mais il reste vide !
y a t'il eu des modif du panier entre la 1.4.0.17 et la 1.4.1 ?

干将ooo · May 24, 2011

Bonjour,

Je suis sur la version 1.4.0.17 et en applicant les modifications je vois bien l'image produit "s'envolé" vers le panier mais il reste vide !
y a t'il eu des modif du panier entre la 1.4.0.17 et la 1.4.1 ?

Bonjour,

Je sais pas trop si il y avait des modifs de panier entre les deux versions.

En principe, il y aurait 2 'requests ajax' à lancer, Pour les vérifier , vous pouvez utiliser Firebug sous Firefox.

PS: Je viens de tester sous IE8, ça marche .

干将ooo · May 24, 2011

Bonjour,

Je suis sur la version 1.4.0.17 et en applicant les modifications je vois bien l'image produit "s'envolé" vers le panier mais il reste vide !
y a t'il eu des modif du panier entre la 1.4.0.17 et la 1.4.1 ?

c'est bizarre, Je viens de le tester,ça marche aussi sous ie8.

huner · May 24, 2011

Oui alors je dois faire une mauvaise manip c'est vraiment bizare je vais essayer en mettant en place une install vide et en modifiant uniquement le panier

干将ooo · May 24, 2011

Oui alors je dois faire une mauvaise manip c'est vraiment bizare je vais essayer en mettant en place une install vide et en modifiant uniquement le panier

Dans ta formulaire de la personnalisation, les champs sont bien textarea ? si c'étaient input:text, le script ne marchera pas.

huner · May 24, 2011

je pense que je suis en textarea pour le champs texte :

{if !empty($field.name)}{$field.name}{/if}{if $field.required}^*{/if}<textarea type="text" name="textField{$field.id_customization_field}" id="textField{$customizationField}" rows="1" cols="40" class="customization_block_input" />{if isset($textFields.$key)}{$textFields.$key|stripslashes}{/if}</textarea>

干将ooo · May 25, 2011

je pense que je suis en textarea pour le champs texte :
{if !empty($field.name)}{$field.name}{/if}{if $field.required}^*{/if}<textarea type="text" name="textField{$field.id_customization_field}" id="textField{$customizationField}" rows="1" cols="40" class="customization_block_input" />{if isset($textFields.$key)}{$textFields.$key|stripslashes}{/if}</textarea>

C'était très bizarre, J'ai fait beaucoup de tests sous les conditions différentes:

En local(EasyPHP/windows): FF,IE tout marche,
En ligne(serveur linux):FF c'est bon, mais ça ne marche pas sous IE.

Est-ce que quelqu'un qui a des solutions ou proposition ?

huner · May 25, 2011

je vais mettre en ligne dans la journée ma version de test peut être trouveras tu le problème

Cordialement.

b2comm · June 14, 2011

Bonjour à tous

je viens de tester sur Prestashop 1.4.2, et il m'arrive exactement la même chose que Huner.
- Si les champs ne sont pas obligatoires, le produit est ajouté au panier, mais sans la personnalisation.
- Si les champs sont obligatoires, comme Huner je vois bien l’image produit “s’envoler” vers le panier mais il reste vide également.
Testé sous Chrome, IE et FF.

Amicalement

b2comm · June 14, 2011

Bon,

l'erreur doit venir de ma part. J'ai modifié le template product.tpl (notamment le bloc pêrsonnalisation est passé tout en haut, colonne de droite) mais quand je remets le template par défaut, ça marche.
Donc j'essaie de trouver d'où ça vient... mais en tous cas pas des développeurs !
JE vous tiens au courant.
Bonne soirée.

b2comm · June 14, 2011

Bon bien... incompréhensible.
Je viens de remettre mon template modifié (sans intervention dessus depuis tout à l'heure) et maintenant... ça marche...!
M'enfin.
Encore merci

polux · June 21, 2011

Bonjour à tous,

Alors cette astuce est juste géniale, cependant je rencontre le même problème que certains à savoir que lorsque les champs textes ne sont pas obligatoires, je ne retrouve pas dans les champs textes rentrés par le client dans le panier (lui non plus dailleurs)..
Quelqu'un a t-il trouvé une solution?
J'ai également transféré le bloc de personnalisation dans la colonne de droite.

Merci d'avance

Yann

polux · June 23, 2011

tit up

b2comm · June 30, 2011

Re bonjour

je reviens encore juste pour une petite remarque (qui n'enlève rien à la valeur du module et à son utilité!) mais dommage que celui-ci ne soit pas valide W3C.

Pour le code javascript contenu dans le footer, j'ai corrigé certaines choses :

-script type="text/javascript" au lieu de "script"

- le caractère spécial "&" au lieu de "&" - à remplacer 5 fois

- suppression complète de la ligne commentée par //, car la présence d'un

à l'intérieur pose problème.

J'espère que ceci n'a pas d'influence sur le bon comportement du script ?

Il reste encore quelques erreurs mais je ne trouve pas d'ou vient le problème. Les voici sur le .png joint.

Amicalement, et bonne journée à tous.
PS : test W3C effectué sur une version 1.4.3 en XHTML strict.

b2comm · June 30, 2011

Re

Par rapport à mes changements : j'ai remis le code tel qu'il était, sinon il y a des erreurs.
J'essayerai de revenir dessus quand j'aurai le temps.
A bientôt

akoba · September 8, 2011

Bonsoir à tous,

Je viens de lire ce post qui répond parfaitement au problème que je rencontre sur la V 1.3.6.

Malheureusement je n'arrive pas un insérer le code ds le footer sans que ce bout de code s'affiche sur mon site ?

Je dois être naze car je ne lis personne qui n'y arrive pas comme moi.

Ou dois placer exactement la code ds mon footer pour que le code s’exécute et ne s'affiche pas ?

Je vous remercie pour votre réponse

Franck

{if !$content_only}

</div>

{$HOOK_RIGHT_COLUMN}

</div>

<div id="footer">{$HOOK_FOOTER}</div>

</div>

{/if}

</body>

</html>

misterpink · January 16, 2012

Bonjour,

cette solution ne fonctionne pas pour prestashop 1.4.6.2, quelqu'un aurais t il réussi a ce que ça fonctionne sous cette version?

merci d'avance

misterpink · January 30, 2012

Bonjour,

personne n'as une petite solution pour que ce code marche sur la dernière version de prestashop?

merci d'avance

bllcll · March 6, 2012

up

RegisD · March 6, 2012

salut,

j'était justement en train de me prendre la tête pour implémenter un truc similaire (pour remplis un champ de personnalisation par un js au moment de l'envoi et fonction d'un icone cliqué sur ma fiche produit), je vois dans les commentaire que le code n'a pas l'air de passer sur la 1.4.6.2, je vais tester ça et voir si je peux adapter, merci d'avoir partagé ce bout de code.

( au passage est ce que quelqu'un peut m'expliquer à quoi sert exactement le bouton enregistrer sur les personnalisations, comment presta stock il l'info ?, je crois comprendre que presta stocke l'info saisie dans un cookie lorsque la form de personnalisation est soumis, est-ce bien ça j'ai un doute ? )

RegisD · March 8, 2012

salut, je ne suis pas sur de comprendre un truc dans le bloc de code suivant (à la fin de la 1ere page de la discussion ),



for(var w=0; w		temp += '&'+$('#'+ids[w]).attr('name')+'='+encodeURIComponent($('#'+ids[w]).val());
if($('#'+ids[w]).parent().hasClass('required') && $('#'+ids[w]).val()=='')
{
alert('Attention, vous devez personnaliser ce produit avant de le commander.');
$('#'+ids[w]).focus();
return false;
}

est-ce que le code est cassé au début du for ? :

for(var w=0; w		temp +=.......

l'espace entre w et temps ? on dirait qu'il manque un bout du for

[edit] bon finallement j'ai utilisé la 1ere version du code, je n'utilise qu'un seul champ de personnalisation et il n'est pas requis (enfin il l'est mais pas depuis l'admin, je fais un test autrement dans mon js ).

la question au dessus reste valable

RegisD · March 8, 2012

ah je pense avoir trouvé pour 1.6.4, le html des templates a dû changer depuis, il faut faire une modif sur le code de la commande en un clic donné sur le topic et remplacer les '#customizationForm input:eq(0)' par '#customizationForm textarea:eq(0)' ( dans le $(document).ready(function(){} ainsi que dans le code ajouté à ajax-cart.js )

par contre presta n'affiche pas la valeur de la personnalisation dans le cart -ajax immédiatement après l'envoi (en rechargeant la page le contenu s'affiche correctement par contre), je viens détester avec le template par défaut ça n'a pas l'air de s'y afficher non plus...

redtango2 · March 23, 2012

Bonjour

je cherche a comprendre comment on peut ne ne mettre "q'une seule personnalisation"

même si la commande comporte plusieurs produits.

Dit autrement : mon client commande plusieurs produits - et au final

avant la validation

il ne remplit qu'un seul champs de personnalisation (valable pour toute la commande)

Est ce que quelqu'un l'a déjà fait

ou je suis sur une mauvaise piste et il y aurait un autre moyen ?

POLUX as mis les champs de personnalisation (pour moi c'est uniquement du texte)

dans la colonne de droite - comment est ce possible ?

Merci de vos réponses

Redtango

le script du Forum marche chez moi PS 131

RegisD · March 25, 2012

salut redtango, je ne suis pas sur de comprendre, tu veux ajouter un champ texte de personnalisation global pour la commande et pas individuel pour les produits ? sur la page de la commande alors ? j'avais vu ce plugin mais il est pour la 1.4 t je suis pas sur qu'il gere les champs de textes...

Sinon il me semblait avoir vu un hack qui permettait d'ajouter des champs d'options sur la page commande mais impossible de remetre la main dessus, peut être sur le forum anglais, mais s'il s'agit juste d'ajouter un champs de texte, peut être que sans chercher trop loin tu pourrais utiliser le champ de commentaires de la commande

Tsatrap · January 15, 2013

Je sais que ce topic date un peu , mais est - il toujours d’actualité ?

J'ai quelques problèmes avec mon site et cette solution pourrait m'être grandement utile (pour une partie de mon problème tout au moins ! ), mais j'ai la version 1.5.3 et je ne sais pas si la version est incompatible où si je m'y suis mal pris ... Je mets un lien vers le topic que j'ai créer, tout y est expliqué

http://www.prestashop.com/forums/topic/215813-generateur-de-declinaison-dans-prestashop-153/page__p__1065752#entry1065752

Edited January 15, 2013 by Tsatrap (see edit history)

Zulian · January 21, 2013

Salut ! je viens donner mon code, qui se base sur les posts précédents, avec quelques modifs...

Je tourne sous PS 1.5. Par contre je ne gère pas d'upload de fichiers, donc aucune idée du comportement de ce côté là ! Ce code se place dans ajax-cart.js, en remplacement du code existant, vers la ligne 45...

$('body#product p#add_to_cart input').unbind('click').click(function(){
  var ids = new Array();
		$("#customizationForm textarea.customization_block_input").each(function(){
			ids.push($(this).attr("id"));
		});	

  $('#quantityBackup').val($('#quantity_wanted').val());
  customAction = $('#customizationForm').attr('action');
  $('body select[id^="group_"]').each(function() {
customAction = customAction.replace(new RegExp(this.id + '=\\d+'), this.id +'='+this.value);
  });

		var temp = 'quantityBackup=0&submitCustomizedDatas=1';
  $.each(ids, function(key, val) {
temp += '&'+$('#'+val).attr('name')+'='+encodeURIComponent($('#'+val).val());
console.log(temp);
  });
  $.ajax({
url: customAction,
global: false,
type: "POST",			  
data: temp,
dataType: "html",
async:false,
success: function(msg){
ajaxCart.add( $('#product_page_product_id').val(), $('#idCombination').val(), true, null, $('#quantity_wanted').val(), null);			  
  }
  })

  return false;  
 });

Edited January 21, 2013 by Zulian (see edit history)

FrancoisV · April 4, 2013

Bonjour à tous,

Je viens de suivre l'astuce ci-dessous, j'ai changé une lettre dans le _COOKIE_KEY_ et tout d'un coup plus aucun affichage sur mon site. Firefox affiche une page toute blanche et Chrome affiche erreur 500. Firebug ne m'apprend rien de plus "NetworkError: 500 Internal Server Error". Une idée?

Attention Le nouveau script mis en place, l'erreur persistera tant que les Cookies ne sont pas vidés. Nous l'avons testé. Les cookies restent pendant plusieurs semaines chez les visiteurs. L'astuce est donc de vider les cookies des visiteurs, et donc l'ancienne valeur de personnalisation, en changeant la valeur du "_COOKIE_KEY_" dans /config/settings.inc.php Il suffit de changer une lettre par un chiffre, ça fera l'affaire.

J'ai essayé de remettre l'ancienne valeur, mais plus aucun affichage, la galère.

FrancoisV · April 4, 2013

En fait je viens de comprendre mon erreur, le fichier settings.inc.php que j'avais en local n'était pas la dernière version

Il datait d'un précédent prestashop, le 1.4.10.0

J'avais fait les maj de la boutique par la méthode automatique en ligne et je n'ai pas récupéré le fichier en local.

Quelqu'un sait comment rattraper cette erreur? Peut-on regenerer settings.inc.php?

mathrem · July 5, 2013

BONJOUR

J'ai 9 champs texte de personnalisation de produit, tous requis, sous version 1.5.3.1

Y a-il une possibilité pour que le client ne soit pas obligé de remplir ces champs pour chaque produit ajouté au panier, ce qui est très fastidieux

merci

stevent · August 1, 2013

Bonjour, ceci fonctionne aussi sous 1.5 ? merci

stevent · August 1, 2013

Bonjour, est ce que ce système fonctionne aussi avec 1.5?

Lorsque je suis les étapes dont vous parlez, le code s'affiche littéralement sur ma page en bas du site.

A mon avis je choisis mal l'endroit ou placer ce bout de code dans mon footer.tpl...

Quelqu'un peut m'aider svp??

Merci à vous !

[ASTUCE] Personnalisation d’un produit et commande en un seul clic

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment