Jump to content

Problème mise à jour produit (page produit) changement quantité


Recommended Posts

Bonjour à tous !

Je retravaille complètement un site actuellement et j'ai du modifier la partie add to cart sauf que maintenant, lorsque je clique pour modifier les quantités, aucune mise à jour de la page produit :

Voici mon add to cart tpl :

{if !$configuration.is_catalog}
  <div class="product-add-to-cart add-to-cart-jl">
    {block name='product_quantity'}
      <div class="product-quantity clearfix">
        {if $product.add_to_cart_url}
          <div class="product-qty">
            <span class="control-label cart-quantity-jl">{l s='Quantity' d='Shop.Theme.Catalog'}</span>
            <div class="qty clearfix">
              <input type="number" name="qty" id="quantity_wanted" value="{$product.quantity_wanted}" class="input-group"
                min="{$product.minimal_quantity}" aria-label="{l s='Quantity' d='Shop.Theme.Actions'}">
            </div>
          </div>
        {/if}
        <div class="add">
          <button class="btn {if !$product.add_to_cart_url} btn-danger {else} btn-primary {/if} add-to-cart"
            data-button-action="add-to-cart" type="submit" {if !$product.add_to_cart_url} disabled
            style="background-color:#d9534f ;" {/if}>
            {if !$product.add_to_cart_url}
              {l s='Rupture de stock' d='Shop.Theme.Actions'}
            {else}<i class="icon-basket shopping-cart"></i>
              {l s='Add to cart' d='Shop.Theme.Actions'}
            {/if}
          </button>
        </div>
        <div class="compare-wishlist-wrapper">
          {hook h='displayLeoWishlistButton' product=$product}
          {hook h='displayLeoCompareButton' product=$product}
        </div>

        {hook h='displayProductActions' product=$product}
      </div>
    {/block}
  </div>
{/if}

Voici mon encart d'ajout au panier :

<div class="card">
        {block name='product_prices'}
          {include file='catalog/_partials/product-prices.tpl'}
        {/block}
        <form action="{$urls.pages.cart}" method="post" id="add-to-cart-or-refresh">
          <input type="hidden" name="token" value="{$static_token}">
          <input type="hidden" name="id_product" value="{$product.id}" id="product_page_product_id">
          <input type="hidden" name="id_product_attribute" value="{$product.id_product_attribute}"
            id="id_product_attribute">
          <input type="hidden" name="id_customization" value="{$product.id_customization}"
            id="product_customization_id">
          <div class="card-content-jl">
            <div class="row">
              <div class="col-sm-6">
                <ul class="bulletpoints-jl">
                  <li>Extrement efficace</li>
                  <li>Nettoie en profondeur</li>
                  <li>Redonne un look neuf</li>
                </ul>
              </div>
              <div class="col-sm-6 variants-row-jl">
                {block name='product_variants'}
                  {include file='catalog/_partials/product-variants.tpl'}
                {/block}
              </div>
            </div>
            <p class="estimated-delivery-jl">Livraison le <span id="quick-delivery-jl"><span
                  class="lds-dual-ring"></span></span> ou le <span id="free-delivery-jl"><span
                  class="lds-dual-ring"></span></span> offerte dès 75€</p>
            {block name='product_add_to_cart'}
              {include file='catalog/_partials/product-add-to-cart.tpl'}
            {/block}
          </div>
          {block name='product_refresh'}
            <input class="product-refresh ps-hidden-by-js" name="refresh" type="submit"
              value="{l s='Refresh' d='Shop.Theme.Actions'}">
          {/block}
        </form>
      </div>

J'avoue avoir essayé d'ajouter un onchange sur mon input quantity_wanted, cependant, lorsque je clique sur les  up ou down, rien du tout, la value de l'input reste inchangée.

J'ai cherché comment pouvoir fire l'event d'update de produit dans le core.js mais bon, tout a été "simplifié" avec des fonctions qui n'ont pour nom qu'une simple lettre.

Je suis preneur de n'importe quelle solution.

image.png

Link to comment
Share on other sites

  • 4 weeks later...

Bonjour, difficile à dire car vous êtes n'êtes pas sur le thème classic de Prestashop. Mais quelque chose me paraît bizarre,

le nom de la classe

<div class="product-add-to-cart add-to-cart-jl">

normalement sur le thème classic c'est

<div class="product-add-to-cart js-product-add-to-cart">

j'ai vu plusieurs "-jl" dans votre code, donc je ne sais pas si c'est Leo theme qui fait ça ou vous, mais ça peut avoir un impact dans le ciblage des éléments par le JS.

Link to comment
Share on other sites

1 minute ago, Mdesign49 said:

Bonjour, difficile à dire car vous êtes n'êtes pas sur le thème classic de Prestashop. Mais quelque chose me paraît bizarre,

le nom de la classe

<div class="product-add-to-cart add-to-cart-jl">

normalement sur le thème classic c'est

<div class="product-add-to-cart js-product-add-to-cart">

j'ai vu plusieurs "-jl" dans votre code, donc je ne sais pas si c'est Leo theme qui fait ça ou vous, mais ça peut avoir un impact dans le ciblage des éléments par le JS.

Bonjour,

 

Merci pour votre retour, ce sont des classes customs pour stylisé, qui ont simplement été rajoutées.

 

Le problème à finalement été réglé, de mémoire, je crois que c'est simplement les balises

 <form action="{$urls.pages.cart}" method="post" id="add-to-cart-or-refresh">

qui n'entouraient plus mon add to cart directement c'est à dire que mon atc était inclus dans une nouvelle div et n'était plus un enfant direct du form, le schéma du sélecteur est peut être basé sur les enfants direct (form#add-to-cart-or-refresh > .product-add-to-cart ) et ne considère pas un 'sub' enfant

Par ailleurs, j'ai décidé tout re-développer depuis le thème classic initial (en 1.7.7.2) et je confirme, la div est la suivante

<div class="product-add-to-cart">

 

  • Like 1
Link to comment
Share on other sites

  • 2 weeks later...
On 11/10/2022 at 4:18 PM, Mdesign49 said:

Bonjour, 

Parfait, autant pour moi c'est dans les dernières versions qu'à été ajouté cette classe "js-product-add-to-cart" mais effectivement ça paraissait être un problème de ciblage.

 

Exact, merci pour ton aide en tout cas ;)

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
×
×
  • Create New...