Bonjour à tous,
Je vais essayer d’être le plus clair possible dans mes explications. J’ai une page de produits qui se présente sous la forme de cart bootstrap. J’aimerais que quand l’utilisateur ajoute un produit dans le panier, la cart bootstrap correspondant à ce dernier soit désactivée, afin que l’utilisateur ne puisse pas ré ajouter le même produit.
J’ai tout d’abord pensé à le faire en javascript qui semblait tout indiqué pour ce genre de chose. Mais le problème, c’est que quand j’ajoute un produit, je ne veux pas avoir dans la base de données une ligne par produit. Du coup, j’ai fais en sorte que tout les produits qu’un utilisateur ajoute aille dans la base sur la même ligne dans un tableau que je serialize. Je récupère l’id de l’utilisateur, et jusqu’à ce qu’il valide la commande, les produits s’ajoute sur la même ligne. Hors, la fonction en js que j’avais fais, cela ne fonctionnait plus et j’avais un produit par colonne dans la base. Il aurait fallu que je fasse un système en Ajax qui évite le rechargement de page, mais je ne maîtrise absolument pas ce langage malheureusement ..
Voici le code que j’ai produit jusqu’alors :
{% for row in products|batch(4) %}
<div class="card-deck">
{% for product in row %}
<div class="card mb-4">
<img src="{{ product.image_file }}" class="card-img-top" style="max-height: 250px;" alt=""/>
<div class="card-body">
<h5 class="card-title">{{ product.name }}</h5>
<p class="card-text">
{{ product.description }}
</p>
</div>
<div class="card-footer text-center">
{{ form.start({action:generate('technicien_carts_add')}) }}
{{ tag.input({type:'hidden', name:'product_id', value: product.id}) }}
{{ tag.input({type:'number', name:'quantity', class:'d-inline w-50'}) }}
<button type="submit" name="disableForm" class="btn btn-primary"><i class="fas fa-cart-plus"></i></button>
{{ form.end() }}
</div>
</div>
{% endfor %}
Je vous remercie d’avance pour votre aide.
