I\'m developing a site using Bootstrap which has 28 modal windows with information on different products. I want to be able to print the information in an open modal window.
Here's an option using a JQuery extension I made based on the code by waspinator in the comments of the accepted answer:
jQuery.fn.extend({
printElem: function() {
var cloned = this.clone();
var printSection = $('#printSection');
if (printSection.length == 0) {
printSection = $('')
$('body').append(printSection);
}
printSection.append(cloned);
var toggleBody = $('body *:visible');
toggleBody.hide();
$('#printSection, #printSection *').show();
window.print();
printSection.remove();
toggleBody.show();
}
});
$(document).ready(function(){
$(document).on('click', '#btnPrint', function(){
$('.printMe').printElem();
});
});
JSFiddle: http://jsfiddle.net/95ezN/1227/
This can be useful if you don't want to have this applied to every single print and just do it on your custom print button (which was my case).