如何单击Braintree PayPal结帐按钮来验证自定义表单?

时间:2019-07-19 05:39:54

标签: javascript php paypal braintree braintree-vault

我想通过单击Braintree PayPal签出按钮来验证自定义PHP表单。 当前,如果表单填写不正确,它将重定向到PayPal屏幕。

因此,如果表单输入无效,我想停止打开PayPal弹出窗口。

这是我的代码。

有可能吗,请分享一些想法

braintree.client.create({
        authorization: ''
    }, function (clientErr, clientInstance) {

        // is invalid.
        if (clientErr) {
            console.error('Error creating client:', clientErr);
            return;
        }

        // Create a PayPal Checkout component.
        braintree.paypalCheckout.create({
            client: clientInstance
        }, function (paypalCheckoutErr, paypalCheckoutInstance) {


            if (paypalCheckoutErr) {
                console.error('Error creating PayPal Checkout:', paypalCheckoutErr);
                return;
            }

            // Set up PayPal with the checkout.js library
            paypal.Button.render({
                env: 'sandbox', // or 'sandbox'

                payment: function () {
                    return paypalCheckoutInstance.createPayment({

                    });
                },

                onAuthorize: function (data, actions) {
                    return paypalCheckoutInstance.tokenizePayment(data, function (err, payload) {
                        // Submit `payload.nonce` to your server.                        
                        form.submit();

                    });
                },

                onCancel: function (data) {
                    console.log('checkout.js payment cancelled', JSON.stringify(data, 0, 2));
                },

                onError: function (err) {
                    console.error('checkout.js error', err);
                }
            }, '#paypal-button').then(function () {

            });
        });
    });

1 个答案:

答案 0 :(得分:0)

全部披露:我在Braintree工作。如果您还有其他疑问,请随时与support联系。

最简单的方法是以编程方式禁用“提交”按钮,直到字段正确为止。您可以通过添加以下内容(并添加自己的自定义逻辑或验证)来做到这一点:

if (dropinInstance.isPaymentMethodRequestable()) {
    // This will be true if you generated the client token
    // with a customer ID and there is a saved payment method
    // available to tokenize with that customer.
    submitButton.removeAttribute('disabled');
  }

  dropinInstance.on('paymentMethodRequestable', function (event) {
    console.log(event.type); // The type of Payment Method, e.g 'CreditCard', 'PayPalAccount'.
    console.log(event.paymentMethodIsSelected); // true if a customer has selected a payment method when paymentMethodRequestable fires

    submitButton.removeAttribute('disabled');
  });

  dropinInstance.on('noPaymentMethodRequestable', function () {
    submitButton.setAttribute('disabled', true);
  });