使用Braintree onPaymentMethodReceived

时间:2016-06-30 06:21:53

标签: javascript asp.net braintree

我正在使用他们的自定义表单进行Braintree集成。我在提交表单之前首先要运行的其他表单字段上有一些自定义验证。根据他们的documentation我正在使用onPaymentMethodReceived回调,以便我可以在发回之前首先检查页面是否有效。我的表单按钮有一个服务器端onclick处理程序(lnkBuyNow_Click)。

<asp:Button ValidationGroup="purchaseval" ID="lnkBuyNow" OnClick="lnkBuyNow_Click" runat="server" Text="Complete order"></asp:Button>

我面临的问题是,如果我调用$('<%= lnkBuyNow.ClientID %>').click(),Braintree会再次调用onPaymentMethodReceived函数,这会阻止页面回发并陷入循环。建议的方法是使用$form.submit(),但是如果我这样做,那么我就失去了服务器上的onclick处理程序 - 我需要它。下面是我用来初始化Braintree的代码,然后是回调函数

braintree.setup('<%= braintreeClientToken %>', 'custom', {id: 'form1', onPaymentMethodReceived: braintreeResponseHandler});

function braintreeResponseHandler(response) {
    var $form = $('#form1');
    Page_ClientValidate();
    if (Page_IsValid) {                    
        var token = response.nonce;
        // Insert the token into the form so it gets submitted to the server
        $form.append($('<input type="hidden" name="payment_method_nonce" />').val(token));
        // and submit                      
        //$('#<%= lnkBraintreeDummy.ClientID %>').click();//This would allow the lnkBuyNow_Click of the button to fire on the server
        $form.submit();//This works as expected but now lnkBuyNow_Click does not get fired.
    }                
};

两个问题

  1. 如果页面有效,有没有办法规避Braintree的事件处理程序,以便我可以调用$('<%= lnkBuyNow.ClientID %>').click()
  2. 如果没有,有没有办法让.NET认为在使用$form.submit()时点击了一个按钮

1 个答案:

答案 0 :(得分:0)

我想出来了。 Braintree有一个teardown method

  

将清理所有DOM节点,事件处理程序,弹出窗口和/或iframe   已由集成创建

这意味着我可以删除按钮单击的事件处理程序,并可以直接调用按钮的单击。

我最终做的是:

var braintreeCheckout;
function braintreeResponseHandler(response) {
    var $form = $('#form1');
    Page_ClientValidate();
    if (Page_IsValid) {                    
        var token = response.nonce;
        braintreeCheckout.teardown(function () {
            braintreeCheckout = null;
            $form.append($('<input type="hidden" name="payment_method_nonce" />').val(token));                  
            $("#<%= lnkBuyNow.ClientID %>").click();                        
        });

    }                
};

braintree.setup('<%= braintreeClientToken %>', 'custom', {
    id: 'form1', 
    onPaymentMethodReceived: braintreeResponseHandler,
    onReady: function (integration) {
        braintreeCheckout = integration;
    }
});