Braintree sdkでの失敗した取引でクレジットカードのフィールドをリセットする方法

Question

私はBraintree sdkをクレジットカード決済用に実装しました。

トランザクションの失敗時にクレジットカード情報をリセットするにはどうすればよいですか？

私はprocessor_declinedとして応答を得ました。

エラーが発生した場合は、既存のカード情報を削除してフィールドをリセットします。

おかげ

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

Answer 1

あなたは（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 
    } 
    }); 
}); 

、あなたは$http.post('api/db/btpay.php',data)ビットとfunctionToSendNonceToServerに記入。