How to print barcode in ASP.NET MVC application?
Syncfusion ASP.NET MVC Barcode control is a server-side control that allows you to easily generate and display various types of barcodes on your ASP.NET MVC web application.
First, we need to create a MVC application. Refer the below link to create a MVC barcode application.
https://ej2.syncfusion.com/aspnetmvc/documentation/barcode/getting-started
To print the barcode, we need to follow the below steps.
Step 1: Convert the barcode into an image format
You can use the Syncfusion Barcode control's exportAsBase64Image() method to retrieve the barcode data as a base64-encoded image data.
Step 2: Write the image data to the print window
Use the document.write() method to display the barcode image on the print window by passing the retrieved barcode image data as a parameter.
Step 3: Print the window
Finally, you can use the window.print() method to print the contents of the print window.
Refer the code snippet below.
<div class="control-section">
<input type="button" value="Print" id="print" />
@(Html.EJS().BarcodeGenerator("container").Width("200px").Height("150px").Value("SYNCFUSION").Type(Syncfusion.EJ2.BarcodeGenerator.BarcodeType.Code39).Render())
</div>
var button = document.getElementById('print');
button.onclick = async function () {
// Get the barcode control element
var barcode = document.getElementById('container').ej2_instances[0];
// Export the barcode as an image
var data = await barcode.exportAsBase64Image('JPG');
// Create an Image object and set its source to the barcode data
var imge = new Image();
imge.src = data;
// Create a new window for printing and write the barcode image to it
var printWind = window.open('', 'imge');
printWind.document.write('<img src="' + data + '"/>');
// Wait for the image to load in the print window, then print the window
printWind.addEventListener('load', function (event) {
setTimeout(function () {
printWind.window.print();
}, 500);
});
printWind.document.close();
}
Refer the sample below.
Sample:
