Campo importo personalizzato striscia

Question

Stripe ha un nuovo pagamento piuttosto semplice con il pulsante della carta. Voglio hackerarlo così posso passare un importo personalizzato ad esso.

Ho un div con una forma

<div> 
<form> 
<select> 
<option value"1000">$10</option> 
<option value:2000>$20</option> 
</select> 

o un tasto di ingresso

<input id="amount" /> 
<button id="buy">Buy Shirt</button> 
</form> 
</div> 

quando l'utente fa clic sul pulsante Acquista la maglia div per la paga con il tasto striscia è mostrato e la il valore selezionato sopra viene passato al campo della striscia di quantità di dati. L'importo iscritto in ingresso dovrà essere moltiplicato per 100 in quanto i dati-stripe importo deve essere in centesimi

<div id='form' style="display:none"> 
<form action="" method="POST"> 
<script 
src="https://checkout.stripe.com/v2/checkout.js" class="stripe-button" 
data-key="pk_kgwan(blah blah)" 
data-amount="2000" 
data-name="Demo Site" 
data-description="2 widgets ($20.00)" 
data-image="/128x128.png"> 
</script> 
</form> 
</div> 

senza strisce doc su come fare questo.

Answer 1

Prima sostituire lo script con un pulsante normale:

  <button id="customButton" class="btn btn-primary">Pay</button> 

quindi inserire uno script come questo. Nel mio caso, i miei pulsanti radio hanno un nome di "affare". Li faccio scorrere per trovare quello che è stato selezionato, quindi inserisco il giusto valore e descrizione nella funzione di apertura stripe:

 <script> 
     $('#customButton').click(function(){ 
      var token = function(res){ 
      var $input = $('<input type=hidden name=stripeToken />').val(res.id); 
      $('form').append($input).submit(); 
      }; 

      var dealValue; 
      var deal = document.getElementsByName('deal'); 
      for (var i = 0, length = deal.length; i < length; i++) { 
       if (deal[i].checked) { 
        dealValue = deal[i].value; 
       } 
      } 

      var description; 
      if(dealValue == 1000) 
       description = "small t-shirt"; 
      else if(dealValue == 2000) 
       description = "medium t-shirt"; 
      else if(dealValue == 3000) 
       description = "large t-shirt"; 

      StripeCheckout.open({ 
      key:   'putyourkeyhere', 
      amount:  dealValue, 
      currency: 'usd', 
      name:  'putyourname', 
      description: description, 
      panelLabel: 'Checkout', 
      token:  token 
      }); 

      return false; 
     }); 
     </script>