Empêche le déclenchement de l'événement onclick de la ligne de table lorsque vous cliquez sur le bouton à l'intérieur de la ligne

Question

J'ai une ligne de table avec événement ONCLICK (qui permet de basculer les données supplémentaires ci-dessous). À l'intérieur d'une des cellules de rangée j'ai un bouton (quand cliqué exécute une action d'AJAX). Lorsque je clique sur le bouton - l'événement onClick de la ligne se déclenche également et ce qui se passe est que les données supplémentaires apparaissent avant la fin de l'appel AJAX (ce qui est un mauvais comportement pour moi). Des idées comment puis-je résoudre cela élégamment? (sans l'identifier et le coder dans le code onclick de la ligne) Merci

Answer 1

Ajoutez un event.stopPropagation(); à vos boutons click handler. Pour plus d'informations, jetez un oeil here et here.

Answer 2

Si vous n'aimez pas la solution javascript, dans de nombreux cas, une solution CSS est également possible:

style="pointer-events: none;" 

Ce sera supress le <tr> événement onclick.

Cependant, dans certains cas, j'ai toujours eu des problèmes où cela ne semblait pas fonctionner. Dans la majorité des cas, je viens d'utiliser le style ci-dessus.