He diseñado unas tarjeta que representan un mensaje, esta tarjeta es un botón con varios componentes más, uno de ellos es un <a>
que actúa como botón.
El código sería así:
<button id="message" class="btn btn-lg btn-primary" onclick="getMessage('{{ $message -> id }}', '{{ $type_user }}')">
<div class="row">
<div id="top" class="col-md-12">
<div class="row">
<div class="col-md-2">
</div>
<div class="col-md-8">
<p>{{ $message -> text }}</p>
</div>
<div class="col-md-2">
<a type="button" class="btn btn-secundary" data-bs-toggle="modal" data-bs-target="#staticBackdrop">
<i class="fas fa-trash-alt" data-bs-toggle="tooltip" data-bs-placement="right" title="Eliminar mensaje"></i>
</a>
</div>
</div>
</div>
</div>
</div>
El problema es que al "clickar" sobre el <a>
, muestra correctamente el "tooltip" pero también se ejecuta el método "onclick" del botón que lo contiene.
¿Alguien podría decirme si hay alguna forma de evitar que esto ocurra?