Braintree : How can i select a payment method and obtain a payment method nonce using a custom UI?

Question

I am trying to use braintree for payments in a web application. The flow i'm after is :

• user registration : create a Braintree customer, associate its id with the user
• first payment : show a custom UI for the credit card information, use the Braintree tutorial for adding a credit card and make the payment.
• second payment : show a list of payment methods for the customer. When he/she selects one, make a payment using the selected payment method.

I am stumped at how i'm supposed to implement the second payment part. Assuming i keep payment methods info and show the client a list of payment methods, how do i obtain a payment method nonce i need to be able to execute a sale Transaction?

To clarify, i'm not using the Dropin UI because :

• i need more information than it can show when entering a credit card (like cardholder)
• i need to have a custom look-and-feel ui in different languages

I've read the Braintree guides and reference and i couldn't find and resource for a custom ui where i can reuse the payment method information.

Any input is highly appreciated.

Answer 1

_{I work at Braintree. If you need more help, I suggest you email our support team.}

When you store a credit card (by passing a nonce to credit card or payment method create) the response you get back contains a token. You can store this token permanently and use it in the future to make payments on the same card.

Answer 2

You can charge the user with his payment token or customer id: https://developers.braintreepayments.com/guides/transactions/ruby#sale-with-vaulted-payment-methods

result = Braintree::Transaction.sale(
  :payment_method_token => "the_token",
  :amount => "10.00"
)

# or

result = Braintree::Transaction.sale(
  :customer_id => "the_customer_id",
  :amount => "10.00"
)