QRCode with Footer Text

Recently, I was working with a library which helps to generate barcode within images,

the open source library is called ZXing (http://zxingnet.codeplex.com/).

Its a free library with lots of great features and even supports QRCode generation.

The only missing feature I came across was of writing a Barcode Text below the generated image,

like the sample image below.

I reached out ZXing support team, here they replied to my thread..

Implementing such functionality in an html page was not that a big task..

Anyway here I came up with a solution. Hope this helps you..

<div style="border: 1px double black;width:50%;text-align:center;" id="PrintBarcode">
<div><asp:Image ID="imgBarcode" runat="server" /></div>
<div style="margin-top:-10px;"><asp:Label ID="lblTexttoDisplay" runat="server"></asp:Label></div>
</div><br />
<a ID="PrintMe" runat="server" Text="Print" onclick=""></a>
<script type="text/javascript">
function PrintMe()
{
var popupWin = window.open('', '_blank', 'width=0,height=0,directories=0,fullscreen=0,location=0,menubar=0,
resizable=0,scrollbars=0,status=0,titlebar=0,toolbar=0');
popupWin.document.open();
var divToPrint = document.getElementById('PrintBarcode');
popupWin.document.write('<html><body onload="window.print();this.close();">
<div style="border: 0px double black;width:50%;text-align:center;">' + divToPrint.innerHTML + '</div></html>');
}
</script>

Next Recommended Reading How to Only Allow Numbers in a Text Box using jQuery.