Reputation: 199
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
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
Reputation: 207521
Use stopPropagation
$('body').on('click', '.fa-trash-o', function (e) {
e.preventDefault();
e.stopPropagation();
$('#slettModal').modal();
});
Upvotes: 2
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