Ajax sur bouton "Add to cart" supplémentaire

[ccyyrriillee]

Bonjour,

Je fais des tests pour déplacer le bouton d'ajout au panier de la page produit.
Je joins une copie d'écran pour que ça soit plus clair.
Pour l'instant j'ai juste ajouté dans product.tpl ces lignes:

<form id="add2" action="{$base_dir}cart.php" method="post">

           <!-- hidden datas -->


               <input type="hidden" name="token" value="{$static_token}" />
               <input type="hidden" name="id_product" value="{$product->id|intval}" id="product_page_product_id" />
               <input type="hidden" name="add" value="1" />
               <input type="hidden" name="id_product_attribute" id="idCombination" value="" />


quantity == 0} style="display:none;"{/if} id="add_to_cart" class="buttons_bottom_block"><input type="submit" name="Submit" value="{l s='Add to cart'}" class="exclusive" /></p>
       </form>

Sur l'image jointe il y a donc 2 boutons, le nouveau et celui original dans le buyblock.
Mon bouton supplémentaire fonctionne bien mais le mode ajax n'est pas pris en compte (ça fonctionne bien sur le bouton d'origine)
Je ne sais pas trop où faire les modifs pour corriger ça.

Merci d'avance pour votre précieuse aide...

[Vincent Decaux]

Alala un peu de curiosité te conduirait dans le fichier ajax-cart.js du module blockcart.
Tu y verrais ici les sélecteurs pour les boutons. En dehors du conteneur d'une fiche produit (soit buyblock), il faut utiliser une classe spécifique.

Cette classe est : "exclusive ajax_add_to_cart_button"
Et penser à mettre un rel sur le , de la forme : rel="ajax_product_id_2" (2 étant l'ID du produit)

[ccyyrriillee]

Bonjour et merci Vincent,

Figure toi que ma curiosité m'avait bien emmené du côté du fichier ajax-cart.js, mais après disons que... chacun son domaine de compétences

En gros il y a 6 mois je ne savais même pas ce qu'était une feuille de style, à force de me documenter et d'apprendre je maitrise maintenant à peu près le html et css mais tout ce qui concerne le php ou javascript je commence seulement à découvrir (à force de vouloir faire des modifs on est bien obligé de s'y mettre...)

Du coup ajax-cart.js oui il me semblait bien que ça se jouait là-bas mais pour l'instant je n'ai pas les connaissances suffisantes pour m'en sortir tout seul. Par contre je suis plein de motivation et de bonne volonté donc si tu as un peu de temps à m'accorder pour m'expliquer plus précisément ce que je dois faire ça sera bien sympa (je suis à peu près logique et pas trop bête, tu ne t'embarques pas dans un plan galère )

De mon côté je vais de ce pas commencer mon apprentissage de ces langages bien utiles. Au passage si tu as des tutos à me conseiller je suis preneur (quand je cherche un truc je vais souvent du côté du site du zéro mais il y a peut être mieux...)

Merci encore

[Vincent Decaux]

Il n'y a pas de tutos bien faits ou autre, la seule voie c'est l'expérience sur des projets concrets. Prestashop est un bon départ déjà.
Je te conseille de regarder du côté de jQuery et de sa documentation (sur les sélecteurs surtout) pour comprendre un peu. Le Javascript est un langage très simple, seul le jQuery complique le tout.

Par exemple, dans ajax-cart.js, tu as au début :

       //for every 'add' buttons...
       $('.ajax_add_to_cart_button').unbind('click').click(function(){
           var idProduct =  $(this).attr('rel').replace('ajax_id_product_', '');
           ajaxCart.add(idProduct, null, false, this);
           return false;
       });
       //for product page 'add' button...
       $('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);
           return false;
       });

Le $ suivi de quelque chose représente un sélecteur, qui permet de sélectionner un élément. Du coup, on voit que pour la page produit, il y a un sélecteur spécifique : ('body#product p#add_to_cart input'). Si ton bouton ne respecte pas ce chemin (contenu dans body de id=product, puis dans p de id = add_to_cart et de type input), ça ne marchera pas.
Du coup, le mieux est d'utiliser l'autre sélecteur (.ajax_add_to_cart_button), c'est à dire un élément de classe = ajax_add_to_cart_button.
Enfin je te mets un minimum sur la voie, mais le gros est la. Après regarde la fonction add et ses paramètres.
Sois curieux au maximum, c'est le seul conseil que je peux te donner...

[ccyyrriillee]

Super, merci pour ce début de piste.
Pas le temps de voir ça maintenant mais demain c'est dimanche
Enfin j'ai compris le principe donc je vais essayer de me dépatouiller avec tout ça histoire de coller un "résolu" dans pas trop longtemps...

[ccyyrriillee]

Mouais bon, premières tentatives pas vraiment concluantes.
J'ai essayé de me baser sur les boutons add to cart qui se trouvent dans la liste de produits

{l s='Add to cart'}

Alors juste ce bout de code évidement ça marche pas, j'ai bien un bouton mais avec une erreur dans l'exécution du script (quand il essaye de récupérer l'id du produit il me semble)
Certainement une histoire de {foreach} à mettre quelque part mais voilà, c'est vraiment un truc que je ne maitrise pas encore et j'aimerais bien régler ce soucis avant d'apprendre tout ça.

Du coup je veux bien une solution "fast-food", tant pis c'est pas ce que je préfère mais bon...

[ccyyrriillee]

Un petit test juste pour tenter de comprendre:
J'ai essayé tout simplement de doubler le contenu du buyblock, donc tout ce qui se trouve dans la balise

<form id="buy_block" action="{$base_dir}cart.php" method="post">
</form>

Résultat j'ai bien tout en double (image jointe) et du coup les deux boutons sont normalement contenus dans les mêmes balises.
Mais ça fonctionne toujours de la même façon: le premier bouton pas de soucis, mais le deuxième n'est pas pris en compte pour l'effet ajax.

C'est quoi le truc qui me manque pour comprendre là ???