In this article, I would demonstrate how to use a 3rd party barcode generation service and render the returned result back in the form. Though I have used an open source service for the sample app, same concept would work for any of the paid subscription service for barcode generation.
Start by creating a form which has a textbox called “VoucherNumber” and an image control called “barcodeImage”. VoucherNumber textbox would be used in the demo to enter a barcode # but in a real world application, it might be coming from a webservice or some backend system.
On the change event of the “VoucherNumber” control, associate the following script to be executed using the form rule builder. You can also do this as form load rule in the “VoucherNumber” control is populated by a backend service or a lookup. Assuming it is populated on the control value changed, you would use following JavaScript in the JavaScript editor
function generateBarCode()
{
waitForElementToLoad(“#VoucherBarCode img”, function($img){
$img.attr(“src”, “http://www.barcodes4.me/barcode/c39/” + $(“#VoucherNumber”).val() + “.png?IsTextDrawn=1&IsBorderDrawn=1&width=900”);
});
}
Then this JavaScript function is wired up with the change event of VoucherNumber in following way
The result would look as shown below
