[PART-2]PHP Razorpay Payment Gateway Integration in Website with dbconnect.php??
In this tutorial we will learn about how to Integrate Razorpay Paymnet Gateway and how to store payment data in database??
For more details watch above video:
1. Create database in phpmyadmin like payment.php with table name:
name, amount, payment_status, payment_id,created_at,updated_at
2. To create an html form we are using below code:
Razorpay.php
<!DOCTYPE html>
<html lang="en">
<head>
<title>Razorpay</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js"></script>
</head>
<body>
<div class="container mt-3" style="width: 50%;">
<h2 style="color:blue;">Razorpay Payment Integration in PHP</h2>
<form action="#">
<div class="mb-3 mt-3">
<label for="email" style="color:blue;">User Name:</label>
<input type="email" class="form-control" id="name" placeholder="Enter Name" name="name">
</div>
<div class="mb-3">
<label for="pwd" style="color:blue;">Amount:</label>
<input type="number" class="form-control" id="amount" placeholder="Enter Amount" name="amount">
</div>
<div class="mb-3">
<label for="pwd" style="color:blue;">Description:</label>
<input type="text" class="form-control" id="description" placeholder="Enter Description" name="description">
</div>
<button type="button" class="btn btn-primary" id="rzp-button1" onclick="pay_now()">Pay</button>
</form>
</div>
</body>
</html>
Below is the code for Razorpay script and Database connectivity with ajax call to store data in database:
<script src="https://code.jquery.com/jquery-3.6.1.min.js"></script>
<script src="https://checkout.razorpay.com/v1/checkout.js"></script>
<script type="text/javascript">
function pay_now(){
//here we are taking output from form
var name = $("#name").val();
var amount = $("#amount").val();
var actual_amount = amount*100;
var description = $('#description').val();
var options = {
"key": "write your razorpay Key Id", // Enter the Key ID generated from the Dashboard
"amount": actual_amount, // Amount is in currency subunits.
"currency": "INR",
"name": name,
"description": description,
"image": "",
//"order_id": "order_IluGWxBm9U8zJ8",
"handler": function (response){
console.log(response);
$.ajax({
url: 'payment.php',
'method': 'POST',
'data': {'payment_id':response.razorpay_payment_id,'amount':amount,'name':name},
success:function(data){
console.log(data);
}
});
},
};
var rzp1 = new Razorpay(options);
rzp1.on('payment.failed', function (response){
});
document.getElementById('rzp-button1').onclick = function(e){
rzp1.open();
e.preventDefault();
}
}
</script>
In this code we are connecting with database using payment_process.php file and storing data in database:
$.ajax({
url: 'payment_process.php',
'method': 'POST',
'data': {'payment_id':response.razorpay_payment_id,'amount':amount,'name':name},
success:function(data){
console.log(data);
}
});
Here is an dbconnect.php file:
<?php
$servername='localhost';
$username="root";
$password="";
try
{
$con=new PDO("mysql:host=$servername;dbname=payment",$username,$password);
$con->setAttribute(PDO::ATTR_ERRMODE,PDO::ERRMODE_EXCEPTION);
//echo 'connected';
}
catch(PDOException $e)
{
echo '<br>'.$e->getMessage();
}
?>
In above code "payment" is our database name.
Below is our payment_process.php file
<?php
include 'dbconnect.php';
if (isset($_POST['payment_id']) && isset($_POST['amount']) && isset($_POST['name'])) {
$paymentId = $_POST['payment_id'];
$amount = $_POST['amount'];
$name = $_POST['name'];
try {
$sql = "INSERT INTO razorpay_payment (name, amount, payment_status, payment_id) VALUES ('$name', '$amount', 'paid', '$paymentId')";
$stmt = $con->prepare($sql);
$stmt->execute();
echo "Data inserted successfully.";
} catch (PDOException $e) {
echo "Error: " . $e->getMessage();
}
}
?>
In above code we are storing our all data in razorpay_payment table. By using this above code you can execute your simple website very easily.
Below is our full code:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Razorpay</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js"></script>
</head>
<body>
<div class="container mt-3" style="width: 50%;">
<h2 style="color:blue;">Razorpay Payment Integration in PHP</h2>
<form action="#">
<div class="mb-3 mt-3">
<label for="email" style="color:blue;">User Name:</label>
<input type="email" class="form-control" id="name" placeholder="Enter Name" name="name">
</div>
<div class="mb-3">
<label for="pwd" style="color:blue;">Amount:</label>
<input type="number" class="form-control" id="amount" placeholder="Enter Amount" name="amount">
</div>
<div class="mb-3">
<label for="pwd" style="color:blue;">Description:</label>
<input type="text" class="form-control" id="description" placeholder="Enter Description" name="description">
</div>
<button type="button" class="btn btn-primary" id="rzp-button1" onclick="pay_now()">Pay</button>
</form>
</div>
</body>
</html>
<script src="https://code.jquery.com/jquery-3.6.1.min.js"></script>
<script src="https://checkout.razorpay.com/v1/checkout.js"></script>
<script type="text/javascript">
function pay_now(){
//here we are taking output from form
var name = $("#name").val();
var amount = $("#amount").val();
var actual_amount = amount*100;
var description = $('#description').val();
var options = {
"key": "rzp_test_FViTaNsOKBZAyt", // Enter the Key ID generated from the Dashboard
"amount": actual_amount, // Amount is in currency subunits.
"currency": "INR",
"name": name,
"description": description,
"image": "",
//"order_id": "order_IluGWxBm9U8zJ8",
"handler": function (response){
console.log(response);
$.ajax({
url: 'process_payment.php',
'method': 'POST',
'data': {'payment_id':response.razorpay_payment_id,'amount':amount,'name':name},
success:function(data){
console.log(data);
}
});
},
};
var rzp1 = new Razorpay(options);
rzp1.on('payment.failed', function (response){
});
document.getElementById('rzp-button1').onclick = function(e){
rzp1.open();
e.preventDefault();
}
}
</script>
For More Details :
Contact : info@infysky.com
Post a Comment