Menu icon Foundation
Print contents of Reveal Modal

I have a JavaScript print link in the content of a modal that should print only the content of that modal. But the whole background page is also printed. Is there a way to get only the modal content to print?

<a href="javascript:;" onClick='window.print();return false'>
            

         

revealmodalprint

I have a JavaScript print link in the content of a modal that should print only the content of that modal. But the whole background page is also printed. Is there a way to get only the modal content to print?

<a href="javascript:;" onClick='window.print();return false'>
            

         

This post has been closed. No new replies can be added.

Sam Stevens almost 6 years ago

This is working for me:

 <script>
function PrintContent()
{
var DocumentContainer = document.getElementById('scorecard');
var WindowObject = window.open("", "PrintWindow",
"width=750,height=650,top=50,left=50,toolbars=no,scrollbars=yes,status=no,resizable=yes");
WindowObject.document.writeln('<!DOCTYPE html>');
WindowObject.document.writeln('<html><head><title></title>');
var str = "<style type='text/css' media='all'>";
      str = str + "MyStyles { text-align: center; }";
            str = str + "</style>";
 WindowObject.document.writeln(str);
WindowObject.document.writeln('</head><body>');
WindowObject.document.writeln(DocumentContainer.innerHTML);
WindowObject.document.writeln('</body></html>');
WindowObject.document.close();
WindowObject.focus();
WindowObject.print();
WindowObject.close();
}
</script>