javascript - Rails braintree 在输入框的 focusout 上捕获错误

标签 javascript jquery ruby-on-rails braintree braintree-rails

我在我的 Rails 应用程序中使用了 braintree。使用 gem 'braintree' 进行集成。我使用了一个像这样实现的 dropin UI:

braintree.dropin.create({
authorization: client_token,
container: '#bt-dropin'
}, function (createErr, instance) {
form.addEventListener('submit', function (event) {
  event.preventDefault();
  instance.requestPaymentMethod(function (err, payload) {
    if (err) {
      console.log('Error', err);
      return;
    }
    // Add the nonce to the form and submit
    document.querySelector('#nonce').value = payload.nonce;
    form.submit();
  });
});
});

这很好用。但是我需要捕获错误(如果有)并在光标从输入框移出时禁用提交按钮。有什么解决办法吗? 请帮忙。

最佳答案

完全披露:我在 Braintree 工作。如果您有任何其他问题,请随时联系 support .

虽然该解决方案无法使用 DropIn 实现,但我建议根据付款方式是否可请求动态启用或禁用您的提交按钮。查看example下面。

var submitButton = document.querySelector('#submit-button');

braintree.dropin.create({
  authorization: 'client_token',
  container: '#bt-dropin'
}, function (err, dropinInstance) {
  submitButton.addEventListener('click', function () {
    dropinInstance.requestPaymentMethod(function (err, payload) {
      document.querySelector('#nonce').value = payload.nonce;
     form.submit();
    });
  });

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

要获得更多控制,我建议查看我们的 Hosted Fields解决方案。

关于javascript - Rails braintree 在输入框的 focusout 上捕获错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46767137/

相关文章:

ruby-on-rails - Google 日历 v3 返回 403 Insufficient Permission

javascript - 为什么此代码不将点击事件绑定(bind)到 A 标签?

javascript - 在 JQuery 中克隆时更改名称属性

ruby-on-rails - 一起使用 Devise 和 has_secure_password 时出现 ArgumentError

ruby-on-rails - Ruby 2.5.1、Ruby Java Bridge (RJB) 和 Ubuntu 18.04 : Getting `Constants DL and Fiddle is not defined.`

JavaScript 使特定字母具有不同的颜色?

javascript - 尽管被设置为特定 IP,但 socket.io 引用本地主机

javascript - 在不使用填充的情况下向 Material UI 网格添加空白列

javascript - Jquery动画效果在第一次点击时不起作用

javascript - 如何在嵌套表中选择不包含某些元素的标签?