Braintree 插件，在处理时禁用提交按钮答案

【问题标题】：Braintree drop-in, disable submit button while processingBraintree 插件，在处理时禁用提交按钮
【发布时间】：2015-04-05 06:16:00
【问题描述】：

我正在尝试做一些看起来很容易但我无法让它发挥作用的事情。我正在使用 Braintree dropin UI，并且我有提交按钮。我需要在处理过程中禁用按钮，但找不到要附加的好事件。

var ct = 'tokenhere';
var bt = braintree.setup(ct, 'dropin', {
  container: 'braintreedropin',
});

<form id="PayByBrainTreeCheckout" method="post">
  <div id="braintreedropin"></div>       
  <input type="submit" value="Pay">                          
</form>

我尝试了$('#PayByBrainTreeCheckout').submit(function(){/*disable button*/})，但如果表单中存在验证错误，这也会禁用按钮。

有什么想法吗？谢谢

【问题讨论】：

标签： javascript jquery braintree

【解决方案1】：

我也在 Braintree 工作。客户可以在提交交易时点击两次提交按钮是正确的，但是您不必担心客户被收取两次费用，因为第二次交易会失败（信用卡生成的随机数可以只能使用一次）。此外，提交后表单上的即时视觉反馈旨在让客户知道他们的按钮正在被处理。

如果您确实想做更复杂的事情（例如添加自定义回调以禁用提交按钮），我们的自定义集成是一个不错的选择。

正如 Mat 所述，如果您在集成方面需要进一步帮助，请随时联系 support@getbraintree.com！

【讨论】：

谢谢@cdeis。最终我选择了自定义集成。这比预期的要容易:)
太棒了！很高兴听到它。
我认为这在处理订阅时不起作用。我使用 nonce 创建付款方式，然后使用存储的付款方式创建交易。所以，第二笔交易会成功。
允许重复提交并希望得到最好的结果是一个糟糕的设计。 requestPaymentMethod 完成并提交表单后，确实应该触发一个事件。

【解决方案2】：

Braintree 即将添加这样的回调。这是 github 问题：https://github.com/braintree/braintree-web/issues/38

会产生这样的结果：

braintree.setup(TOKEN, 'dropin', {
    container: 'my-container',
    onError: function (payload) {
        if (payload.type === 'validation:failed') {
            // re-enable button
        }
    }
});

【讨论】：

拥有某种“beforeSubmit”回调会更好，这样我们就可以确保我们的 UI 在等待大脑树响应时处于良好状态。我们应该只接受重复请求，希望第二个优雅地失败的想法有点愚蠢。

【解决方案3】：

我做了一个如何将 Braintree 与 WebForms 一起使用的工作示例。

https://github.com/StavrosD/BrainTree-PayPal-DotNet

我在 README.md 中描述了工作流程。

【讨论】：

我不相信这会帮助解决 OP 的困境。
这是对初始帖子的直接回答。这是一个有效的示例，可以解决该问题。