Manage the Transaction Details

PayTabs provides you with the backend packages that make the integrating with PayTabs payment gateway very easy by providing ready-made classes that handle the payment process.

This article is dedicated to walking you through how to manage how to initiate a payment request with a specific transaction type. The following transaction type keys can be sent within the createPaymentPage function as shown below:

Info

Through out the article we will use the transaction types clarified in our What is the "tran_type" (transaction type)? solution article.

---

Method Specification

Be Aware

That the transaction parameter is Mandatory, not passing it would throw an exception.

Description	Create the Payment Page.
Since	1.0.0
Required	✔
Signature	/** * @function createPaymentPage * @param {Array} payment_code - List of accepted payment methods. * @param {Array} transaction - Transaction type and class. * @param {Array} cart - Cart details including ID, currency, amount, and description. * @param {Array} customer - Customer details. * @param {Array} shipping - Shipping details. * @param {Array} urls - Callback and return URLs. * @param {string} lang - Language code (e.g., "en"). * @param {Function} callbackFunction - Function to handle the response. * @param {boolean} [framed=false] - Whether to use a framed payment page. */ PayTabs.createPaymentPage(payment_code, transaction_details, cart_details, customer_details, shipping_address, response_URLs, lang, callback, framed);
Sample	PayTabs.createPaymentPage( paymentMethods, transaction_details, cart_details, customer_details, shipping_address, response_URLs, lang, callbackMethod, frameMode );

---

Method Parameters:

Transaction

Name	transaction
Type	Array
Array Element values:	First sale This means that the amount of the transaction will be deducted directly from the customer's bank account once he submits the purchase, and it will be transferred to the acquirer's bank account. auth This means the amount of the purchase will be deducted from the cardholder's bank account, yet it will be held (authorized) for a certain period of time/days, differing from one issuer bank to another. This amount will remain at the cardholder bank until it gets captured. In other words, it will not be transferred to the acquirer's bank account until it gets captured from your side; otherwise, it will be voided back to the customer. Second ecom The initial request to create any payment page should be with class ecom, which indicates to eCommerce.
Description	This is the second parameter of the createPaymentPage() function, which is an array of two elements the first one is the transaction type which you can mange, but the second one is the transaction class that will be always ecom NO other options are available using this package.
Default	-
Required	✔
Example	let transaction = { type:"sale", class:"ecom" }; let transaction_details = [ transaction.type, transaction.class ];

---

Expected payment flow behaviour:

1. As a merchant you would initiate a payment request per the above Specifications, which include a sample code.


2. Then, after generating the payment page use the result to redirect the customer to the payment page.
   

   function callbackMethod(result) {
       //failed to create the payment page.
       if (result['response_code:'] === 400) {
            // get the message
            console.log(result['result']);
            // Next step
       }
       //success to create the payment page.
       else {
           //On success, redirect the customer to complete the payment.
           console.log(result.redirect_url);
           // Next step
       };
   }
   
   PayTabs.createPaymentPage(
       paymentMethods,
       transaction_details,
       cart_details,
       customer_details,
       shipping_address,
       response_URLs,
       lang,
       callbackMethod,
       frameMode
   );


3. After this, your customer would proceed normally with payment by choosing the preferred payment method (if available), and providing his card information.
   
   


4. Then, he will be redirected to his issuer bank 3DS/OTP page to authenticate the used card


5. Finally, he would be redirect to a success/error page accordingly. By this time, you will be able to see his transaction on your merchant dashboard, whether it's accepted/authorized or not.