Bootstrap logo

How To Completely Remove Bootstrap Modal In Bootstrap 2 And 3

Posted by Weston Ganger on January 05, 2017

Having closed modal’s hang around in the background can be very annoying and cause unexpected selector behaviour. Here are methods to completely remove the modal when its hidden.


Bootstrap 3


/* Automatically */
$(".modal").on('hidden.bs.modal', function () {
  $(this).data('bs.modal', null);
});

/* Manually */
$( '.modal' ).modal( 'hide' ).data( 'bs.modal', null );

Bootstrap 2


/* Automatically */
$('body').on('hide', '.modal', function(e){
  $(e.target).data('modal', null);
});

/* Manually */
$('.modal').remove();
$('.modal-backdrop').remove();
$('body').removeClass( "modal-open" );


Related External Links:


Posted in Javascript and Tagged with bootstrap modal 


Need help on your next project or application?

I specialize in Ruby-on-Rails, AngularJS, Javascript, Bootstrap, and Hybrid Mobile Apps with Cordova & Ionic.

Contact Me

Recommended Posts