Guides

Cordova

Guide for Cordova

Suggest Edits

Demo project

Cordova Plugin: cordova-plugin-myfatoorah
Cordova Plugin Demo: cordova-demo

Installation

  • Run the following commands on your Terminal on the parent directory of your project.
npm i cordova-plugin-myfatoorah
cordova plugin add cordova-plugin-myfatoorah

// for Android
cordova platforms add android 
cordova run android

// for iOS
cordova platforms add ios
cordova run ios

Usage

  1. Initiate MyFatoorah Plugin with the following line:
function init() {
  cordova.plugins.MyFatoorahCordovaPlugin.initiate(
    "Put your API Key here",
    cordova.plugins.MyFatoorahCordovaPlugin.MFCountry.KUWAIT,
    cordova.plugins.MyFatoorahCordovaPlugin.MFEnvironment.TEST
  );
}
  1. (Optional) 
// Use the following lines if you want to set up the title of the page.

function setUpTitle() {
  cordova.plugins.MyFatoorahCordovaPlugin.setUpTitle("MyFatoorah Payment", true);
}

📘

After testing

Once your testing is finished, simply replace the environment from TEST to LIVE and the API Key with the live one, click here for more information.

Initiate / Execute Payment

As described earlier for the Gateway Integration, we are going to have the SDK integrated with the same steps to make a successful integration with the SDK

🚧

Initiate Payment

As a good practice, you don't have to call the Initiate Payment function every time you need to execute payment, but you have to call it at least once to save the PaymentMethodId that you will need to call Execute Payment

// Initiate Payment

function initiatePayment() {
  var initiatePaymentRequest = new cordova.plugins.MyFatoorahCordovaPlugin.MFInitiatePaymentRequest();
  initiatePaymentRequest.invoiceAmount = 0.100;
  initiatePaymentRequest.currencyIso = cordova.plugins.MyFatoorahCordovaPlugin.MFCurrencyISO.KUWAIT_KWD;

  cordova.plugins.MyFatoorahCordovaPlugin.initiatePayment(
  initiatePaymentRequest,
  cordova.plugins.MyFatoorahCordovaPlugin.MFLanguage.ARABIC,
  function (result) {
    if (result["status"] == "success") {
      alert("data:" + JSON.stringify(result["data"]))
    }
    else if (result["status"] == "error") {
      alert("error:" + result["message"])
    }
  });
}

// Eexcute Payment

function executePayment(paymentMethodId) {
  var executePaymentRequest = new cordova.plugins.MyFatoorahCordovaPlugin.MFExecutePaymentRequest();
  executePaymentRequest.invoiceValue = 0.100
  executePaymentRequest.paymentMethod = paymentMethodId

  cordova.plugins.MyFatoorahCordovaPlugin.executePayment(
    executePaymentRequest,
    cordova.plugins.MyFatoorahCordovaPlugin.MFLanguage.ENGLISH,
    function (result) {
      if (result["status"] == "success") {
        alert("data:" + JSON.stringify(result["data"]))
      } else if (result["status"] == "error") {
        alert("error:" + JSON.stringify(result))
      }
    }
  );
}

Send Payment

We have explained in the Send Payment section earlier, the different usage cases for it and how it works, here we are going to embed some sample code for calling it through the SDK on the different platforms

function sendPayment() {
  var sendPaymentRequest = new cordova.plugins.MyFatoorahCordovaPlugin.MFSendPaymentRequest();
  sendPaymentRequest.invoiceValue = 0.100
  sendPaymentRequest.customerName = "customerName"
  sendPaymentRequest.notificationOption = cordova.plugins.MyFatoorahCordovaPlugin.MFNotificationOption.LINK

  cordova.plugins.MyFatoorahCordovaPlugin.sendPayment(
    sendPaymentRequest,
    cordova.plugins.MyFatoorahCordovaPlugin.MFLanguage.ENGLISH,
    function (result) {
      if (result["status"] == "success") {
        alert("data:" + JSON.stringify(result["data"]))
      } else if (result["status"] == "error") {
        alert("error:" + JSON.stringify(result))
      }
    }
  )
}

Payment Enquiry

We have explain the main usage for the Payment Inquiry function, that will enable your application to get the full details about a certain invoice / payment. You can use this function within your application on the different platforms as well. Here we are explaining some samples of its usage through the SDK.

function getPaymentStatus() {
  var getPaymentStatusRequest = new cordova.plugins.MyFatoorahCordovaPlugin.MFPaymentStatusRequest();
  getPaymentStatusRequest.key = "1515410";
  getPaymentStatusRequest.keyType = cordova.plugins.MyFatoorahCordovaPlugin.MFKeyType.INVOICEID;
  
  cordova.plugins.MyFatoorahCordovaPlugin.getPaymentStatus(
    getPaymentStatusRequest,
    cordova.plugins.MyFatoorahCordovaPlugin.MFLanguage.ENGLISH,
    function (result) {
      parseResult(result);
    }
  )
}

Updated about 1 year ago