How to Generate QR Code in Oracle APEX - Javainhand Tutorial

How to Generate QR Code in Oracle Apex

Hello Friends, Welcome to Javainhand.com In this post, we are going to tell you about the QR code generator in oracle apex. In Recent times QR Code is a very demanding and useful implementation in any website or as we have seen in the mobile applications. you can store any information in QR Code. So I am trying to explain to you how can you QR code generator in oracle apex.

So Let's Start Our Topic

What is QR Code?
How to Generate QR Code in Oracle APEX?

What is QR Code?
QR Code is a two-dimensional barcode that is used to store encoded data. People also share their websites link or other information using QR Code.

In this implementation, I am using a third party library QRCode.js. QRCode.js is a javascript library that helps you to generate QR Code.

How to Generate QR Code in Oracle APEX?

Let's Start to follow the below steps to implement QR code generator in oracle apex

Step 1:-Create a Region QR Code Generate, In the Region creates an Input Item and Button. Below Screenshot will help you out.

How to Generate QR Code in Oracle Apex

Step 2:- Create a Display QR Code Region and paste the below code into region static content. the below screenshot will help you.

How to Generate QR Code in Oracle Apex

<div id="qrcode" ></div>

Step 3:- Copy the below URL in to Page Javascript File URLs Section.


Step 4:- Copy Below Code into Function and Global Variable Declaration Section.

var qrcode = new QRCode(document.getElementById("qrcode"), {
width : 256,
height : 256

function makeCode () {
var elText = document.getElementById("P17_INPUT");// Inseed of P17_INPUT use your item name
if (!elText.value) {

Step 5:- Now Call makeCode() function to Generate Button click dynamic action. The below screenshot will help you.

How to Generate QR Code in Oracle Apex

Identification:- Execute Generate QR Code Function
Selection Type:- Button
Button:- Generate

How to Generate QR Code in Oracle Apex

True Action:- Execute Javascript Code
Code:- makeCode();

For Demo:- Click Here

If You Like This Tutorial Please Like Share And Comment.

Post a comment


  1. How am I able to download the QR code using a button?

    1. If You want download QR Code in your system then create a Download QR Code Function. Use below code into function and Global Declaration Section

      function download_qrcode(){
      html2canvas(document.querySelector("#qrcode")).then(function(canvas) {
      var a = document.createElement('a');
      a.href = canvas.toDataURL("image/jpeg").replace("image/jpeg", "image/octet-stream");
      a.download = 'image.jpg';

      After that code this function into your button click dynamic action.

      One more thing add below URL into your Javascript URL Section.

      I think this code will help you.

  2. Hello, I hope you're doing well.

    This code is great, congratulations, I would like to store the QR image to a blob column, is that possible?

    Could you help me, please.

    1. Yes It is possible to store the QR image to a blob column with the help of ajax process.


If you have any doubts, Please let me know