Patrick Fritch
Patrick Fritch

Reputation: 199

Prevent event from triggering

I got two functions, one that collapses stuff when someone clicks the header of that collapsable, and I got a function that opens a modal, but the open modal icon that I use as a trigger to open the modal, is on the header of the collapsable, so when someone clicks the icon, it both opens the modal, and does the collapse stuff, but I just want to open the modal and not do the collapse stuff, so how can I prevent it from triggering my collapse?

Collapse

$(document).on('click', '.panel-heading', function () {

var valgtElement = $(this).next();

$.each($('.panel-collapse'), function (index, value) {

    if ($(this).attr('id') == valgtElement.attr('id')) {
        $(this).collapse('toggle');
    } else {
        if ($(this).hasClass('in')) {
            $(this).collapse('toggle');
        }

    }

});

});

Icon click

$('body').on('click', '.fa-trash-o', function () {

$('#slettModal').modal();

});

Upvotes: 0

Views: 97

Answers (3)

pjobs
pjobs

Reputation: 1247

just use event.stopPropagation()

Link for more details

$('body').on('click', '.fa-trash-o', function (e) {
 e.preventDefault();
 e.stopPropagation();
 $('#slettModal').modal();
});

Upvotes: 1

epascarello
epascarello

Reputation: 207521

Use stopPropagation

$('body').on('click', '.fa-trash-o', function (e) {
    e.preventDefault();
    e.stopPropagation();
    $('#slettModal').modal();
});

Upvotes: 2

AmmarCSE
AmmarCSE

Reputation: 30557

Try this

 $('body').on('click', '.fa-trash-o',
             function (event) {
                event.stopImmediatePropagation()
                $('#slettModal').modal();

  });

make sure to include the event parameter in the function declaration

http://api.jquery.com/event.stopImmediatePropagation/

How to prevent other event handlers, from first handler, in jQuery

Upvotes: 0

Related Questions