Understanding How Data-dismiss Attribute Works In Bootstrap

I'm new to Bootstrap and i'm facing problem with this example:

Basically it's just finding the elements that have the attribute of data-dismiss and the value of modal. Upon click it will hide these elements.

Solution 2:

replace data-dismiss="modal" by: onclick="$('#modal_id').modal('hide');"

You should have something like this:

<button type="button" class="close" onclick="$('#modal_id').modal('hide');" aria-label="Close">

onclick="$('#modal_id').modal('hide');" will close only the particular modal in which it is placed.

please note if it is this answer is useful.

Solution 3:

If u use multiple modals on one page open at the same time on top of each other dismissing the topmost with data-dismiss="modal" will hide all active modals.

Solution 4:

exactly in bootstrap.js find the element with attribute data-dismiss="modal" and trigger this.$element.on('click.dismiss.bs.modal', '[data-dismiss="modal"]', $.proxy(this.hide, this)) behind. i.e. it hides the element but in more complex way.