Build QR Code Generator with PHP and Ajax

QR Code (Quick Response Code) is a trademark for a type of matrix barcode. It is a machine readable code that contains information about the item to which it is attached. It can be generated with four standardized encoding modes like numeric, alphanumeric, byte/binary, and kanji. So in this tutorial you will learn how to build QR code generator with PHP. Here we will use PHP QR Code library to create QR Code. We will cover this tutorial in easy steps with live example to ask for required input value to create QR code and display on page and also store in a directory.

Also, read:

• Build Invoice System with PHP & MySQL
• Build Live Chat System with Ajax, PHP & MySQL
• Build Comment System with Ajax, PHP & MySQL

As we will cover this tutorial with live example to build QR code generator using PHP and Ajax, so the major files for this example is following.

• index.php
• ajax_generate_code.js
• generate_code.php

Step1: Create HTML Form with QR Code Options
First we will create Bootstrap HTML Form with required input to generate QR Code. The first input will be Code Content that’s can URL, simple text, contact number, email address etc. The second input Code Level with value as (Best, M, Q, Smallest) to display QR code redundancy to use more space. The third input will be Size that’s define the number of pixels to generate QR code.

<div class="container">		
	<div class="row">
	<h2>Example: Build QR Code Generator with PHP and Ajax</h2>
		<div class="col-md-3">
			<form class="form-horizontal" method="post" id="codeForm" onsubmit="return false">
				<div class="form-group">
					<label class="control-label">Code Content : </label>
					<input class="form-control col-xs-1" id="content" type="text" required="required">
				</div>
				<div class="form-group">
					<label class="control-label">Code Level (ECC) : </label>
					<select class="form-control col-xs-10" id="ecc">
						<option value="H">H - best</option>
						<option value="M">M</option>
						<option value="Q">Q</option>
						<option value="L">L - smallest</option>       		            
					</select>
				</div>
				<div class="form-group">
					<label class="control-label">Size : </label>
					<input type="number" min="1" max="10" step="1" class="form-control col-xs-10" id="size" value="5">
				</div>
				<div class="form-group">
					<label class="control-label"></label>
					<input type="submit" name="submit" id="submit" class="btn btn-success" value="Generate QR Code">
				</div>
			</form>
		</div>
		<div class="col-md-6">
			<div class="showQRCode"></div>
		</div>
	</div>
</div>

Step2: Make Ajax Request To Generate QR Code
In ajax_generate_code.js file, we will make Ajax request to generate_code.php with required Form input values to generate QR code and display it.

$(document).ready(function() {
	$("#codeForm").submit(function(){
		$.ajax({
			url:'generate_code.php',
			type:'POST',
			data: {formData:$("#content").val(), ecc:$("#ecc").val(), size:$("#size").val()},
			success: function(response) {
				$(".showQRCode").html(response);  
			},
		 });
	});
});

Step3: Generate QR Code
In generate_code.php file, we will handle functionality with library PHP QR Code to create QR code image file with QRcode function png() in directory codes using form values and return generated QR code image to display on page.

<?php
if(isset($_POST) && !empty($_POST)) {
	include('library/phpqrcode/qrlib.php'); 
	$codesDir = "codes/";	
	$codeFile = date('d-m-Y-h-i-s').'.png';
	$formData = $_POST['formData'];
	QRcode::png($formData, $codesDir.$codeFile, $_POST['ecc'], $_POST['size']); 
	echo '<img class="img-thumbnail" src="'.$codesDir.$codeFile.'" />';
} else {
	header('location:./');
}
?>

You may also like:

• Star Rating System with Ajax, PHP and MySQL
• Create Event Calendar with jQuery, PHP and MySQL
• Build Your Own CAPTCHA Script with PHP
• Convert Unix Timestamp To Readable Date Time in PHP
• Inventory Management System with Ajax, PHP & MySQL
• Create Live Editable Table with jQuery, PHP and MySQL
• Live Add Edit Delete datatables Records with Ajax, PHP and MySQL
• Stripe Payment Gateway Integration in PHP
• Export Data to Excel with PHP and MySQL
• Star Rating System with Ajax, PHP and MySQL
• Create Dynamic Bootstrap Tabs with PHP & MySQL
• How To Create Simple REST API in PHP

You can view the live demo from the Demo link and can download the script from the Download link below.
Demo Download