2013-04-22 5 views
1

다음은 Stripe.js를 통해 신용 카드 양식을 제출하기위한 일반적인 코드입니다. 나는 아래에 붙여 넣은 백본보기에이 맞게해야합니다스트라이프를 백본보기에 맞추는 방법?

// Add Submit Btn Event Listener and Stripe Token Generator from fields 
    jQuery(function($) { 
     $('#payment-form').submit(function(event) { 
      event.preventDefault(); 
      var $form = $(this); 
      // Disable the submit button to prevent repeated clicks 
      $form.find('button').prop('disabled', true); 
      Stripe.createToken($form, stripeResponseHandler); 
      // Prevent the form from submitting with the default action 
      return false; 
     }); 
    }); // End jQuery random function 
    var stripeResponseHandler = function(status, response) { 
    var $form = $('#payment-form'); 
     if (response.error) { 
      // Show the errors on the form 
      $form.find('.payment-errors').text(response.error.message); 
      $form.find('button').prop('disabled', false); 
     } else { 
      // token contains id, last4, and card type 
      var token = response.id; 
      // Insert the token into the form so it gets submitted to the server 
      $form.append($('<input type="hidden" name="stripeToken" />').val(token)); 
      // and submit 
      $form.get(0).submit(); 
     } 
    }; // End stripeResponseHandler 

(작동하지 않는) 백본보기에이 피팅에서 내 시도 :

WhiteDeals.Views.ProgramPayment = Backbone.View.extend({ 

initialize: function() { 
    _.bindAll(this); 
}, 

events: { 
    "submit form#payment-form": "createStripeToken" 
}, 

createStripeToken: function(event) { 
    event.preventDefault(); 
    var $form = $(this); 
    // Disable the submit button to prevent repeated clicks 
    $form.find('button').prop('disabled', true); 
    Stripe.createToken($form, stripeResponseHandler); 
    // Prevent the form from submitting with the default action 
    return false; 
}, // createStripeToken 

stripeResponseHandler: function(status,response) { 
    var $form = $('#payment-form'); 
    if (response.error) { 
     // Show the errors on the form 
     $form.find('.payment-errors').text(response.error.message); 
     $form.find('button').prop('disabled', false); 
    } else { 
     // token contains id, last4, and card type 
     var token = response.id; 
     // Insert the token into the form so it gets submitted to the server 
     $form.append($('<input type="hidden" name="stripeToken" />').val(token)); 
     // and submit 
     $form.get(0).submit(); 
    } 
}, 

render: function() { 
    var dealProgram = this.model.toJSON() 
    this.$el.html(JST['program/payment']({ dealProgram: this.model.toJSON() })); 
    // Show Payment Modal 
    $('#payment-modal').modal({ 
     show: true, 
     keyboard: true, 
     backdrop: true 
    }) 
    return this; 
} 

});

+0

로는 작동하지 않습니다? –

답변

3

컨텍스트가 동일하지 않습니다. 보기에서 events 오브젝트로 청취자를 바인딩 할 때 컨텍스트는 자동으로보기 자체에 바인드됩니다.
변경 :

var $form = $(this); 

어떤 방법으로

var $form = this.$('#payment-form'); 
+0

@muistooshort 사실, 편집 해 드리겠습니다. – Loamhoof

관련 문제