如何在单击脑树PayPal结帐按钮时验证自定义表单

Question

我想在单击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 () {
            });
        });
    });

Answer 1

_{完全披露：我在Braintree工作。如果您有任何其他问题，请随时联系支持人员。}

最简单的方法是以编程方式禁用提交按钮，直到字段正确为止。您可以通过添加类似以下内容(并添加您自己的自定义逻辑或验证(来执行此操作：

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);
  });