hey guys new here and self teaching myself. I have a code that takes form inputs and converts it into a text blob so my thermal printer can print a label. The script works great I am trying to figure out a way to print either to a print window (the txt code generated) or when I click generate label button directly send to a network printer with the ip of 10.100.2.200. Basically cut down a few steps. Thanks
Here is the page with the code
<!DOCTYPE html>
<html>
<head>
<title>Print Inventory Labels at Papa's</title>
<style>
* {
box-sizing: border-box;
}
div {
padding: 10px;
background-color: #f6f6f6;
overflow: hidden;
}
input[type=text], textarea, select {
font: 17px Calibri;
width: 100%;
padding: 12px;
border: 1px solid #ccc;
border-radius: 4px;
}
input[type=button]{
font: 17px Calibri;
width: auto;
float: right;
cursor: pointer;
padding: 7px;
}
.container{
width: 100%;
margin: 3.2rem auto 0 auto;
}
@media(min-width: 576px){
.container{
max-width: 540px;
}
}
@media(min-width: 768px){
.container{
max-width: 720px
}
</style>
</head>
<body>
<div>
<div class="container">
<div align="center">
<!--Add few elements to the form-->
<img src="https://www.papasjeepram.com/wp-content/uploads/2019/09/logo2.jpg" width="500" height="189">
</div>
<h2>Enter Values to Generate Stock Label</h2>
<div>
<input type="text" onkeyup="this.value = this.value.toUpperCase();"id="txtStock" placeholder="Stock Number" />
</div>
<div>
<input type="text" onkeyup="this.value = this.value.toUpperCase();"id="txtVin" maxlength="17" placeholder="Vin" />
</div>
<div>
<input type="text" onkeyup="this.value = this.value.toUpperCase();"id="txtYear" maxlength="4" placeholder="Year" />
</div>
<div>
<input type="text" onkeyup="this.value = this.value.toUpperCase();" id="txtMake" placeholder="Make" />
</div>
<div>
<input type="text" onkeyup="this.value = this.value.toUpperCase();" id="txtModel" placeholder="Model" />
</div>
<div>
<input type="text" onkeyup="this.value = this.value.toUpperCase();" id="txtColor" placeholder="Color" />
</div>
<div>
<div align="left">
<input type="button" id="bt" value="Generate Label" onclick="saveFile()" />
</div>
</div>
</div>
</body>
<script>
let saveFile = () => {
// Get the data from each element on the form.
const Stock = document.getElementById('txtStock');
const Vin = document.getElementById('txtVin');
const Year = document.getElementById('txtYear');
const Make = document.getElementById('txtMake');
const Model = document.getElementById('txtModel');
const Color = document.getElementById('txtColor');
// This variable stores all the data.
let data =
'\r^XA\n' +
'^A0,213\n' +
'^FO25,35^FD' + Stock.value + '^FS \r\n '+
'^BY3,2,225\n' +
'^FO45,220^BC^FD' + Vin.value + '^FS \r\n '+
'^A0,50\n' +
'^FO45,500^FD' + Year.value + ' ' + Make.value + ' ' + Model.value + ' ' + Color.value + ' ^FS \r\n '+
'^A0,55\n' +
'^FO435,630^FD' + Stock.value + '^FS \r\n '+
'^A0,50\n' +
'^FO275,630^FD' + Year.value + '^FS \r\n '+
'^A0,55\n' +
'^FO45,630^FD' + Stock.value + '^FS \r\n '+
'^A0,50\n' +
'^FO695,630^FD' + Year.value + '^FS \r\n '+
'^A0,55\n' +
'^FO435,835^FD' + Stock.value + '^FS \r\n '+
'^A0,50\n' +
'^FO275,835^FD' + Year.value + '^FS \r\n '+
'^A0,55\n' +
'^FO45,835^FD' + Stock.value + '^FS \r\n '+
'^A0,50\n' +
'^FO695,835^FD' + Year.value + '^FS \r\n '+
'^A0,30\n' +
'^FO45,705^FD' + Make.value + ' ' + Model.value + '^FS \r\n '+
'^A0,30\n' +
'^FO45,745^FD' + Vin.value + '^FS \r\n '+
'^A0,30\n' +
'^FO45,780^FD' + Color.value + '^FS \r\n '+
'^A0,30\n' +
'^FO435,705^FD' + Make.value + ' ' + Model.value + '^FS \r\n '+
'^A0,30\n' +
'^FO435,745^FD' + Vin.value + '^FS \r\n '+
'^A0,30\n' +
'^FO435,780^FD' + Color.value + '^FS \r\n '+
'^A0,30\n' +
'^FO40,900^FD' + Make.value + ' ' + Model.value + '^FS \r\n '+
'^A0,30\n' +
'^FO40,940^FD' + Vin.value + '^FS \r\n '+
'^A0,30\n' +
'^FO40,975^FD' + Color.value + '^FS \r\n '+
'^A0,30\n' +
'^FO435,900^FD' + Make.value + ' ' + Model.value + '^FS \r\n '+
'^A0,30\n' +
'^FO435,940^FD' + Vin.value + '^FS \r\n '+
'^A0,30\n' +
'^FO435,975^FD' + Color.value + '^FS \r\n '+
'^XZ';
// Convert the text to BLOB.
const textToBLOB = new Blob([data], { type: 'text/plain' });
const sFileName = 'Label.txt'; // The file to save the data.
let newLink = document.createElement("a");
newLink.print = sFileName;
if (window.webkitURL != null) {
newLink.href = window.webkitURL.createObjectURL(textToBLOB);
}
else {
newLink.href = window.URL.createObjectURL(textToBLOB);
newLink.style.display = "none";
document.body.appendChild(newLink);
}
newLink.click();
}
</script>
</html>