Hi,

Ik zoek een mooie manier waarmee ik een html-pagina kan printen via een button op een andere pagina.
Dus: ik heb een pagina met een print-button, en die moet een andere html-pagina printen die ook op de server staat.

Dat klinkt makkelijk, maar ik zoek er een die in meerdere browsers werkt. En die heb ik nog niet gevonden.

Iemand tips?
Thanks!
Het werkt nu in Safari en Firefox... Chrome niet, IE weet ik niet.
Valt daar nog wat aan te doen?
Ik heb nu dit:

test.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<script>
function printFrame(id) {
            var frm = document.getElementById(id).contentWindow;
            frm.focus();// focus on contentWindow is needed on some ie versions
            frm.print();
            return false;
}
</script>
</head>

<body>
    <iframe src="print.html" id="test"> </iframe>
    <button onclick="printFrame('test');">DE GROTE PRINTKNOP</button>
</body>
</html>


print.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<script>
function printPage() { print(); }
</script>
</head>

<body>
Hier alles wat geprint moet worden...
</body>
</html>
Probeer het eens met frm.printPage() in plaats van frm.print(). Dan gebruik je de print functie binnen de pagina zodat het door Chrome en Safari niet als onveilig bestempeld wordt.
Dan gebeurt er bij mij nog niks in Chrome, bij jou wel Ben?
Safari en Firefox werkt wel...
IE kan ik niet testen....
Zo werkt het in Firefox, IE, Edge en Chrome. Safari kan ik niet testen:
test.html:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<script>
function printFrame(id) {
            var frm = document.getElementById(id).contentWindow;
			frm.focus();
            frm.postMessage('print', '*'); 
            return false;
}
</script>
</head>

<body>
    <iframe src="print.html" id="test"> </iframe>
    <button onclick="printFrame('test');">DE GROTE PRINTKNOP</button>
</body>
</html>


print.html:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<script>
(function() {
  window.addEventListener('message', function(event) {
    if (event.data == 'print') {
	  window.print();
	}
  });
})();
</script>
</head>

<body>
Hier alles wat geprint moet worden...
</body>
</html>
Super het werkt, zelfs in Safari!

Nog 1 ding, hoe zorg ik ervoor dat het iframe in alle browsers verborgen is?
Dit lijkt niet te werken...?


<iframe src="print.html" id="test" style="display:none;"> </iframe>
visibility: hidden al geprobeerd?

Edit:
Ik lees ook dat HTML5 een hidden argument heeft voor haast elke tag.
display:none werkt wel maar zal niets printen.
visibility: hidden; width:0; height: 0 verbergt voor mij correct.
Speel anders eens met opacity-properties, en eventueel zelfs met de @media print
Super, alles werkt! Thanks allemaal!
Welke oplossing heb je nu toegepast?

Reageren