Implementing Barcode and QR Code

 

Implementing Barcode and QR Code in Oracle APEX

Oracle APEX allows developers to extend standard reports and cards with visual machine-readable elements such as Barcodes and QR Codes. These elements are extremely useful in applications involving inventory management, asset tracking, product catalogs, and logistics systems.

This blog explains how to generate Barcodes using SVG and QR Codes using HTML placeholders directly from SQL queries in Oracle APEX.

Barcode Generation in Oracle APEX

Barcodes can be rendered using SVG and JsBarcode attributes directly from a SQL query. This method allows dynamic barcode creation based on database values.


Barcode SQL Query

SELECT
    id,
    name,
    barcode,

    '<svg class="barcode"
          jsbarcode-format="CODE39"
          jsbarcode-value="' || barcode || '"
          jsbarcode-text="' || barcode || ', ' || name || ', ' || id || '"
          jsbarcode-textmargin="5"
          jsbarcode-linecolor="blue"
          jsbarcode-background="transparent">
     </svg>' AS barcode_svg

FROM barcode_k;

Explanation

  • CODE39 is a widely supported barcode format.

  • jsbarcode-value dynamically encodes the barcode number.

  • jsbarcode-text displays readable details below the barcode.

  • SVG ensures high-quality, scalable output across devices.

  • The barcode renders dynamically for each record.

-----------------------------------------------------------------------------------------------------------------------------

QR Code Generation in Oracle APEX

QR Codes are ideal for storing URLs, product details, or asset references. In APEX, QR codes can be generated using HTML placeholders and populated dynamically from database values.



QR Code SQL Query

SELECT
    name,
    barcode,
    '<div class="qr-code" data-value="' ||
    APEX_ESCAPE.HTML_ATTRIBUTE(website_url) ||
    '"></div>' AS qr_code_html
FROM barcode_k;

Explanation :
  • data-value holds the dynamic QR content (URL or text).
  • APEX_ESCAPE.HTML_ATTRIBUTE ensures secure HTML rendering.
  • The QR code is generated on the client side using JavaScript
  • Prevents XSS and ensures safe attribute handling.

Conclusion


By combining SQL, HTML, and client-side rendering, Oracle APEX enables seamless integration of 
Barcodes and QR Codes into reports and cards. This approach enhances usability, supports automation, 
and modernizes enterprise applications with minimal effort. Whether used for tracking, identification, 
or navigation, barcode and QR code integration adds significant value to any APEX application.

Comments

Post a Comment

Popular posts from this blog

Converting your Spreadsheet into a Cloud App using Oracle APEX

Image
Indian Students List  Spreadsheets are great for storing data, but as data grows, managing, searching, and visualizing it becomes difficult. Oracle APEX makes it easy to transform spreadsheets into powerful, secure, and scalable cloud applications —without heavy coding. In this blog, I share how I converted an Excel spreadsheet into a fully functional Oracle APEX Cloud App , following the official Oracle LiveLabs steps and guidelines . Reference Workshop (Oracle LiveLabs): https://livelabs.oracle.com/ords/r/dbpm/livelabs/view-workshop?wid=631 This implementation closely follows the structure, best practices, and flow explained in the above LiveLabs workshop. What This Blog Covers Using Oracle APEX , I converted an Excel file into a cloud application with: Dashboard Interactive Report Faceted Search Calendar View Map View (India-based data) The data source used is an Excel file containing India School Students List . Now, lets get into a breif where  Step -1 ...
Read more

Building a Wizard-Based Application in Oracle APEX

Image
Oracle APEX Wizard Application In this blog, I’ll walk you through a Wizard-Based Application developed using Oracle APEX , designed to collect user information step by step in a structured, secure, and user-friendly manner. Wizard applications are ideal when data needs to be entered in a specific sequence, ensuring accuracy and improving the overall user experience. Home Page – Wizard Overview Key Highlights: The Home page acts as an introduction to the application and clearly explains the purpose of the wizard. Clean and professional layout Clear explanation of each step in the wizard Visual icons for better understanding A Start button to begin the process Wizard Steps Explained: Step 1: Tax Information Collects the user’s Tax ID for identity validation. Step 2: Bank Details Captures Bank Name, Account Number, and IFSC Code. Step 3: Document Upload Allows users to upload documents like Aadhaar and Passport. Step 4: Review Users verify all entered de...
Read more

Payment Gateway in Oracle APEX using Razorpay

Image
   Razorpay Payment Gateway Integration in Oracle APEX (Step-by-Step Guide) In this blog, I’ll show you how to integrate Razorpay and PayU payment gateways in your Oracle APEX application — similar to my Stripe payment gateway blog. You’ll get step-by-step instructions to implement both gateways, from obtaining API keys to processing payments inside Oracle APEX. 👉 I also have a YouTube video demonstrating the Razorpay integration you can check here: https://youtu.be/T9OyXVbBlPQ YouTube Razorpay Payment Gateway Integration in Oracle APEX Step 1: Create a Razorpay Account Go to https://razorpay.com   and sign up for an account. Navigate to the Dashboard → API Keys . Generate your Test API Key ID and Secret Key (you will replace these with Live keys later). Step 2: Create Required Database Objects Before integration, set up tables and procedures to store order/payment data. Upload your SQL scripts via: SQL Workshop → SQL Scripts → Upload & Run Created page item...
Read more