JSFiddle - React, Tailwind, and code Playground

by superbDeveloper

HTML

<form action="https://sandbox.payfast.co.za/eng/process" method="post" name="frmPay" id="frmPay">

<!-- Receiver Details -->
<input type="hidden" name="merchant_id" value="10000100">
<input type="hidden" name="merchant_key" value="46f0cd694581a">
<input type="hidden" name="return_url" value="http://test.mfbproject.co.za/payment_finished">
<input type="hidden" name="cancel_url" value="http://test.mfbproject.co.za/payment_cancelled">
<input type="hidden" name="notify_url" value="http://test.mfbproject.co.za/payment_notify">

<!-- Payer Details -->
<input type="hidden" name="name_first" value="Bob">
<input type="hidden" name="name_last" value="Smith">
<input type="hidden" name="email_address" value="[email protected]">

<!-- Transaction Details -->
<input type="hidden" name="m_payment_id" value="TRN123456789">
<input type="hidden" name="amount" value="200.00">
<input type="hidden" name="item_name" value="Widget Model 123">
<input type="hidden" name="item_description" value="Widget Model 123">

<!-- Transaction Options -->
<input type="hidden" name="email_confirmation" value="1">

<!-- Security -->
<input type="hidden" name="signature" value="">

</form>

<button id="submitForm">Checkout</button>

JavaScript

$(document).ready(function(){

    $("#submitForm").click(function(){
        
        $("#frmPay").submit();
        
    });
        
});