Problème alerte bootstrap - urgent
debutantejava
-
jordane45 Messages postés 38486 Date d'inscription Statut Modérateur Dernière intervention -
jordane45 Messages postés 38486 Date d'inscription Statut Modérateur Dernière intervention -
Bonjour,
Je tente de reproduire un site Internet de vêtement. Je veux faire apparaitre une alerte si l'utilisateur ne clique pas sur une taille lorsqu'il ajoute le produit à son panier.
Si l'utilisateur clique sur une taille et ajouter à son panier, je ne veux pas d'alerte.
Donc, il me faut deux éléments, soit ne pas cliquer sur une taille + ajouter au panier le produit pour que l'alerte apparaisse à l'écran.
Merci de votre aide,
Chloé
Je tente de reproduire un site Internet de vêtement. Je veux faire apparaitre une alerte si l'utilisateur ne clique pas sur une taille lorsqu'il ajoute le produit à son panier.
Si l'utilisateur clique sur une taille et ajouter à son panier, je ne veux pas d'alerte.
Donc, il me faut deux éléments, soit ne pas cliquer sur une taille + ajouter au panier le produit pour que l'alerte apparaisse à l'écran.
Merci de votre aide,
Chloé
Configuration: Windows / Chrome 96.0.4664.45
A voir également:
- Problème alerte bootstrap - urgent
- Fausse alerte mcafee - Accueil - Piratage
- Fausse alerte connexion facebook - Guide
- Message alerte virus google chrome - Accueil - Virus
- Fausse alerte virus google - Guide
- Alerte lors accès presse-papier - Guide
2 réponses
HTML - tailles:
<p class= "row justify-content-center" id="soustitre">mode éditée moderne</p>
<h6 class= "row justify-content-center" id="produit">La doudoune à capuchon nylon recyclé</h6>
<h5 class= "row justify-content-center">175,00$ CAN</h5>
<p class="ligne"></p>
<p class= "row justify-content-center" id="couleur">Couleur: Violet</p>
<div class="text-center" id="boutoncouleur">
<button type= "button"class="btn btn-primary" id="violet">VV</button> <button type="button" class="btn btn-primary" id="noir">VV</button>
</div>
<p class= "row justify-content-center" id="grandeur">Grandeur: Sélectionnez</p>
<div class="text-center" id="btntaille">
<a href="#" data-id="0" class="btn btn-light btn-color btn-couleur">T.PETIT</a> <a href="#" data-id="1" class="btn btn-light btn-color btn-couleur">PETIT</a><a href="#" data-id="2" class="btn btn-light btn-color btn-couleur">MOYEN</a><a href="#" data-id="3" class="btn btn-light btn-color btn-couleur">GRAND</a><a href="#" data-id="4" class="btn btn-light btn-color btn-couleur">T.GRAND</a>
</div>
HTML - Bouton ajouter à mon sac
<td>
<button type="button" class="btn btn-success" id="ajouterv">AJOUTER À MON SAC</button>
</td>
<td>
<button type="button" class="btn btn-light" id="souhaits">LISTE DE SOUHAITS</button>
</td>
Javascript - pour l'alerte :
$('#ajouterv').on ("click", function(){
if (grandeur == grandeurs[index]) {
$("#alertev").append('<div class="alert alert-danger" role="alert" class="alerte" id="alertev"> Veuillez sélectionner une taille!</div>');
} else {
$(#alertev).remove();
}
});
<p class= "row justify-content-center" id="soustitre">mode éditée moderne</p>
<h6 class= "row justify-content-center" id="produit">La doudoune à capuchon nylon recyclé</h6>
<h5 class= "row justify-content-center">175,00$ CAN</h5>
<p class="ligne"></p>
<p class= "row justify-content-center" id="couleur">Couleur: Violet</p>
<div class="text-center" id="boutoncouleur">
<button type= "button"class="btn btn-primary" id="violet">VV</button> <button type="button" class="btn btn-primary" id="noir">VV</button>
</div>
<p class= "row justify-content-center" id="grandeur">Grandeur: Sélectionnez</p>
<div class="text-center" id="btntaille">
<a href="#" data-id="0" class="btn btn-light btn-color btn-couleur">T.PETIT</a> <a href="#" data-id="1" class="btn btn-light btn-color btn-couleur">PETIT</a><a href="#" data-id="2" class="btn btn-light btn-color btn-couleur">MOYEN</a><a href="#" data-id="3" class="btn btn-light btn-color btn-couleur">GRAND</a><a href="#" data-id="4" class="btn btn-light btn-color btn-couleur">T.GRAND</a>
</div>
HTML - Bouton ajouter à mon sac
<td>
<button type="button" class="btn btn-success" id="ajouterv">AJOUTER À MON SAC</button>
</td>
<td>
<button type="button" class="btn btn-light" id="souhaits">LISTE DE SOUHAITS</button>
</td>
Javascript - pour l'alerte :
$('#ajouterv').on ("click", function(){
if (grandeur == grandeurs[index]) {
$("#alertev").append('<div class="alert alert-danger" role="alert" class="alerte" id="alertev"> Veuillez sélectionner une taille!</div>');
} else {
$(#alertev).remove();
}
});
Mais le truc c'est que quand je clique sur small (par exemple) et après j'ajoute au panier l'alerte apparait autant que quand je clique seulement sur ajouter. Donc je comprends pas quoi mettre dans ma condition pour que l'alerte soit visible seulement si l'utilisateur ne clique pas de taille
Donc...histoire que ça soit suffisamment clair .. commence par nous poster ton code ici ( en utilisant les balises de code )
NB: Pour utiliser les balises de code, commence par lire ENTIEREMENT ce qui se trouve ici
https://codes-sources.commentcamarche.net/faq/11288-les-balises-de-code