2013-04-22 111 views
1

這是通過Stripe.js提交信用卡表單的通用代碼。我需要融入骨幹鑑於這個我已經粘貼了以下:如何將Stripe放入骨幹視圖?

// 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

以何種方式是不工作? – 2013-04-22 21:46:00

回答

3

上下文將不一樣。當您在視圖中將偵聽器與events對象綁定時,上下文將自動綁定到視圖本身。
變化:

var $form = $(this); 

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

@ muistooshort真的,我會編輯它。 – Loamhoof 2013-04-22 22:35:05