使用Stripe的PaymenRequestButton时,如何在提交令牌请求之前更改标签和总数?

时间:2017-11-30 16:06:11

标签: stripe.js payment-request-api

我使用测试数据按钮工作,但有一个表单收集金额并使用下拉列表设置标签。我需要在提交之前使用表单数据更新付款请求按钮。

我初始化了按钮,它出现在我的Android设备上。我在文档准备就绪时调用initPaymentRequest。

function initPaymentRequest(){
    paymentRequest = stripe.paymentRequest({
        country: 'US',
        currency: 'usd',
        total: {
            label: 'Demo total',
            amount: 1000,
        },
    });
    prButton = elements.create('paymentRequestButton', {
        paymentRequest: paymentRequest,
    });

    // Check the availability of the Payment Request API first.
    paymentRequest.canMakePayment().then(function(result) {
        if (result) {
            log("Payment Request Available");
            $(".ux-submit, #payment-request-button").addClass("col-xs-6");
            prButton.mount('#payment-request-button');
        } else {
            log("Payment Request NOT Available");
            $(".ux-submit, #payment-request-button").addClass("col-xs-6");
        }
    });

    paymentRequest.on('click', updatePaymentRequest);
    paymentRequest.on('token', function(ev) {
        // Send the token to your server to charge it!
        fetch('/charges', {
            method: 'POST',
            body: JSON.stringify({token: ev.token.id}),
        })
            .then(function(response) {
                if (response.ok) {
                    // Report to the browser that the payment was successful, prompting
                    // it to close the browser payment interface.
                    ev.complete('success');
                    process_form(ev);
                } else {
                    // Report to the browser that the payment failed, prompting it to
                    // re-show the payment interface, or show an error message and close
                    // the payment interface.
                    ev.complete('fail');
                }
            });
    });
}

function updatePaymentRequest(){;

    paymentRequest = stripe.paymentRequest({
        country: 'US',
        currency: 'usd',
        total: {
            label: $("select[name='charge_label'] option:selected").text(),
            amount: $("#charge-amount").val()*100,
        },
    });

    prButton = elements.create('paymentRequestButton', {
        paymentRequest: paymentRequest,
    });

    $("#payment-request-button").append("<br>update");
}

1 个答案:

答案 0 :(得分:4)

试试这个而不是函数updatePaymentRequest():

paymentRequestElement.on('click', function(ev) {
  paymentRequest.update({
    total: {
      label: $("select[name='charge_label'] option:selected").text(),
      amount: $("#charge-amount").val()*100,
    },
  })
})