Print the Barcode
Environment
| Product | Progress® Kendo UI® Barcode for jQuery |
Description
How can I print the Kendo UI Barcode?
Solution
Open a new window and place the Barcode DOM elements on the page.
<button class="k-button">Print</button>
<div id="toPrint">
<span id="manchego"></span>
</div>
<script>
$(document).ready(function () {
$("#manchego").kendoBarcode({
value: "2346722",
type: "ean8"
});
$('button').click(function(){
var divToPrint=document.getElementById('toPrint');
var newWin=window.open('','Print-Window');
newWin.document.open();
newWin.document.write('<head> <link href="https://kendo.cdn.telerik.com/themes/10.0.1/default/default-main.css" rel="stylesheet" /></head> <body onload="window.print()">'+divToPrint.innerHTML+'</body>');
newWin.document.close();
})
});
</script>
<style>
#manchego svg{
width: 102mm !important;
height: 192mm !important;;
}
@media print{
#manchego svg{
width: 102mm !important;;
height: 192mm !important;;
}
}
</style>