如何在Braintree sdk中重置失败事务中的信用卡字段

时间:2017-08-08 10:00:48

标签: angular braintree

我已经实施了Braintree sdk用于信用卡付款。

如何在交易失败时重置信用卡信息?

我得到了像processor_declined一样的响应。

出错时,我想删除现有的卡信息并重置字段。

enter image description here

由于

$scope.getToken= function()
{
var data = { 'action': 'GETTOKEN'};
var dataJson =  JSON.stringify(data);
var url = 'api/db/getToken.php';
$http.post( url,dataJson)
.success(function(res) {
  if(res)
  {
    if(swal)
      swal.close();

    var authorization = 'production_xxxxxxxx';
    var response = angular.fromJson(res.value);
    if(res.result === 'Success')
    {
      if(res.value){
        $scope.clientToken =res.value.token;
        var submitButton = document.querySelector('#shopin_subscribe');
        braintree.dropin.create({
          authorization: $scope.clientToken,
          selector: '#dropin-container',
          paymentOptionPriority: ['card']
        }, function (err, dropinInstance) {
          if(submitButton){
            submitButton.addEventListener('click', function () {
              dropinInstance.requestPaymentMethod(function (err, payload) {
               if (err) {
                 console.info("Error", err);
                  return;
                }
                $scope.payForPlan(payload.nonce);
              });
            });
          }

         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');
           if($scope.planId === $scope.currentPlan[0]) {
                $scope.disablePayButton=true;
                if(submitButton){
                  submitButton.setAttribute('disabled', true);
                }
                return;
            }
         }

         dropinInstance.on('paymentMethodRequestable', function (event) 
         {
           event.type; // the type of Payment Method, IE CreditCard, PayPalAccount
           submitButton.removeAttribute('disabled');
           if($scope.planId === $scope.currentPlan[0]) {
                $scope.disablePayButton=true;
                if(submitButton){
                  submitButton.setAttribute('disabled', true);
                }
                return;
            }
         });
         dropinInstance.on('noPaymentMethodRequestable', function () {
           submitButton.setAttribute('disabled', true);
         });
       });        
     }
   }
 }
}) ;
}
$scope.payForPlan = function(nonce)
{
swal({   title: "Payment Processing",   timer:10000, text: htmldiv,   html: true,  type: "warning", showCancelButton: false, showConfirmButton: false,  confirmButtonColor: "#DD6B55",   confirmButtonText: "Please wait ...",   closeOnConfirm: false }, function(){    });
   var data = { 'action': 'PROCESS','userId': $scope.user.hashID, 'plan': $scope.planSelected[0],'payment_method_nonce':nonce};
var dataJson =  JSON.stringify(data);

console.info ("JSON String get data"+ dataJson);
var url = 'api/db/btpay.php';

$http.post( url,data)
.success(function(res) {
  if($scope.checkout){
    $scope.checkout.teardown(function () {
      $scope.checkout = null;
    });
  }
  if(res) {
    //swal.close();
    console.info ('checkout response received :' +JSON.stringify(res));
    var response = angular.fromJson(res.value);

    if(res.result === 'Success') {
      var planName = $scope.plansList[response.subscription.planId][1];
      var planString="Congrats! you plan changed to "+ planName;
      $scope.vm.user.planType=response.subscription.planId;
      $rootScope.user.planType=response.subscription.planId;
      $scope.currentPlan=$scope.plansList[response.subscription.planId];
      $scope.currentPlanSubscription = response.subscription;
      $scope.tappedOnPlan = false;
      $rootScope.user.subscriptionId = $scope.vm.user.subscriptionId = response.subscription.id;
      $scope.updateOperation = true;
      $rootScope.globals = JSON.stringify($rootScope.user);

      $cookies['globals'] = $rootScope.globals;

      var submitButton = document.querySelector('#shopin_subscribe');
      submitButton.setAttribute('disabled', true);
      $location.path('app/profile');
      swal("", planString, "success");
    }
    else {
      var failureStr=response.message;
      swal("", failureStr, "error");
    }
  } else {
    swal.close();
    console.info ('checkoutfailed :');
  }
});
return false;
}

1 个答案:

答案 0 :(得分:1)

您需要更新到最新版本的Drop-in(截至撰写本文时为1.6.0)并使用clearSelectedPaymentMethod。以下是文档:https://braintree.github.io/braintree-web-drop-in/docs/current/Dropin.html#clearSelectedPaymentMethod

以下是文档中的示例:

dropinInstance.requestPaymentMethod(function (requestPaymentMethodError, payload) {
  if (requestPaymentMethodError) {
    // handle errors
    return;
  }

  functionToSendNonceToServer(payload.nonce, function (transactionError, response) {
    if (transactionError) {
      // transaction sale with selected payment method failed
      // clear the selected payment method and add a message
      // to the checkout page about the failure
      dropinInstance.clearSelectedPaymentMethod();
      divForErrorMessages.textContent = 'my error message about entering a different payment method.';
    } else {
      // redirect to success page
    }
  });
});

显然,您使用functionToSendNonceToServer位填充$http.post('api/db/btpay.php',data)