How can I insert a Print button that prints a form in a webpage
106,813
Solution 1
Print the whole page
Try adding a button that calls window.print()
<input type="button" value="Print this page" onClick="window.print()">
Print a specific portion/container in a page
<div id="print-content">
<form>
<input type="button" onclick="printDiv('print-content')" value="print a div!"/>
</form>
</div>
then in the HTML file, add this script code
<script type="text/javascript">
function printDiv(divName) {
var printContents = document.getElementById(divName).innerHTML;
w=window.open();
w.document.write(printContents);
w.print();
w.close();
}
</script>
Refer Print <div id="printarea"></div> only?
Solution 2
To print with submit button, add this to your summit script:
<input type="button" value="Print this page" onClick="window.print()">
Keep in mind, this will only trigger whatever browser implemented print capabilities are available at the client.
Solution 3
What you need is the window.print()
:
<form style="text-align:center;">
<p> STUFF </p>
<a href="#" id="lnkPrint">Print</a>
</form>
Javascript:
$( document ).ready(function() {
$('#lnkPrint').click(function()
{
window.print();
});
});
Author by
user2962142
Updated on March 20, 2021Comments
-
user2962142 over 3 years
So, lets say I got a simple form inside a page like this:
<form style="text-align:center;"> <p> STUFF </p> </form>
I wanna add a button so when the user clicks on it the browser's Print dialog shows up, how can I do that?
Edit: I wanna print the form, not the page.