テストデータを使用してボタンを機能させていますが、金額を収集してドロップダウンでラベルを設定するフォームがあります。送信する直前に、フォーム データで支払い要求ボタンを更新する必要があります。
ボタンを初期化すると、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");
}