Search

Are you looking for test card numbers?

Would you like to contact support?

Payment-method icon

Drop-in

Add Indonesian payment methods to an existing drop-in integration.

Our Web Drop-in renders cash payments at convenience stores and bank transfer options in your payment form, and presents the shopper with a voucher to complete the payment.

Before you begin

This page explains how to add Indonesian payment methods to your existing Web Drop-in integration. The Web Drop-in integration works the same way for all payment methods. If you haven't done this integration yet, refer to our Drop-in integration guide.

Before starting your payment method integration:

  1. Make sure that you have set up your back end implementation, and added Drop-in to your payments form.
  2. Add the payment method in your test Customer Area.

Show the payment method in your payment form

Drop-in uses the countryCode and the amount.currency from your /paymentMethods request to show the available payment methods to your shopper.

To show the required payment method type in your payment form, specify in your /paymentMethods request:

Optional Drop-in configuration

When creating an instance of Drop-in, you can also include optional configuration for presenting the list of payment method types.

Make a payment

When the shopper selects the Pay button, Drop-in calls the onSubmit event, which contains a state.data.

  1. Pass the state.data to your server.

  2. From your server, make a /payments request, specifying:
    • paymentMethod: The state.data.paymentMethod from the onSubmit event from your front end.

{
   "amount":{
      "currency":"IDR",
      "value":10000
   },
   "reference":"12345",
   "paymentMethod":{
      "type":"doku_alfamart",
      "firstName":"John",
      "lastName":"Smith",
      "shopperEmail":"1212@aaa.com"
   },
   "returnUrl":"http://localhost:8080/",
   "merchantAccount":"YOUR_MERCHANT_ACCOUNT"
}

{
   "resultCode":"PresentToShopper",
   "action":{
      "expiresAt":"2019-07-21T16:59:00",
      "initialAmount":{
         "currency":"IDR",
         "value":1000
      },
      "instructionsUrl":"...",
      "merchantName":"YOUR_MERCHANT_NAME",
      "paymentMethodType":"doku_alfamart",
      "reference":"888882603010314",
      "shopperEmail":"1212@aaa.com",
      "shopperName":"J Smith",
      "totalAmount":{
         "currency":"IDR",
         "value":1000
      },
      "type":"voucher"
   }
}   
  1. Pass the action object to your front end. Drop-in needs the action object to present the voucher to the shopper.

Present the payment result

Make sure to handle the action object obtained from the /payments response in handleAction to present the voucher to the shopper.
As the voucher is an offline payment method, there is no need to handle the redirect back from the acquirer. We will send you a webhook notification informing you about the payment status.
The eventCode values you receive with your notification are:

eventCode success field Description Action to take resultCode
PENDING true The voucher reference is successfully created and the transaction is pending. Present the shopper with the voucher and wait for the payment. PresentToShopper
AUTHORISATION false The voucher reference is not successfully generated and the transaction failed. Cancel the order and inform the shopper that the payment failed. Error
AUTHORISATION true The shopper successfully completed the payment. Inform the shopper that the payment has been successful and proceed with the order. PresentToShopper
OFFER_CLOSED true The shopper did not complete the payment before the voucher expired. Cancel the order and inform the shopper that the payment timed out. PresentToShopper

Optional customization

You can customize the expiry date of the payment voucher. By default, the validity period is 48 hours. To change the validity of the voucher, contact the Support Team.

You can change the language of the payment voucher to Indonesian by using the language code id-ID. To do so, make sure to specify the locale in the code for the checkout page.

Test and go live

Use our test vouchers and card numbers to simulate the payments.

Check the status of the test payments in your Customer Area, under Transactions > Payments.

See also