einrichten Streifen mit benutzerdefinierten Höhe

Ich habe ein problem mit der Einstellung benutzerdefinierte Menge, ich würde gerne die Daten-Menge zu, was Benutzer wählen Sie im input id="custom-Spende-Betrag", wie soll ich das machen. mein Versuch funktioniert nicht.

<script
  src="https://checkout.stripe.com/checkout.js" class="stripe-button"
  data-image="images/button.png"
  data-key="pk_test_FTZOOu9FL0iYJXXXXXX"
  data-name="Fund"
  data-label= "DONATE"
  data-description="ysysys"
  data-amount = 
  >

    $('.donate-button').click(function(event){
    var self = $(this);
    var amount = 0;
     amount = $('#custom-donation-amount').val();
      if (amount === "") {
        amount = 50;
      }

    amount = self.attr('data-amount');
    amount = Math.abs(amount * 100);
  });

</script>
 <input type="number" id="custom-donation-amount" placeholder="50.00" min="0" step="10.00"/>

Siehe mein Beitrag hier für eine einfache schnelle Lösung für dieses- [1]: stackoverflow.com/a/50080786/7618391

InformationsquelleAutor lipenco | 2014-01-13

Der jeweiligen Methode (einfache, eingebettete Formular) verwendet wird, funktioniert nicht in Richtung der begehrten Ende.
Sie müssen stattdessen die flexibler benutzerdefinierte integration, wie gesehen in den docs.
Das einzige, was nicht enthalten, im Beispiel ist, wie man hook up die Menge input, das ist überhaupt nicht schwierig.

<input class="form-control"
       type="number"
       id="custom-donation-amount"
       placeholder="50.00"
       min="0"
       step="10.00"/>
<script src="https://checkout.stripe.com/checkout.js"></script>
<button id="customButton ">Purchase</button>
<script>
  var handler = StripeCheckout.configure({
    key: 'pk_test_ppailxxxxxxxxxxxxxxxxxxx',
    image: '/square-image.png',
    token: function(token) {
      //Use the token to create the charge with a server-side script.
      //You can access the token ID with `token.id`
    }
  });

  document.getElementById('customButton').addEventListener('click', function(e) {
    //This line is the only real modification...
    var amount = $("#custom-donation-amount").val() * 100;
    handler.open({
      name: 'Demo Site',
      description: 'Some donation',
      //... aside from this line where we use the value.
      amount: amount
    });
    e.preventDefault();
  });
</script>

Beachten Sie, dass Sie tatsächlich füllen Sie das token: Funktion übergeben StripeCheckout.configure nennen. Insbesondere müssen Sie entweder ein Formular Absenden oder eine ajax-Anfrage und handle entsprechend auf Ihrem server. Sie verwenden dann diese Informationen auf dem server, zusammen mit den sezernieren Schlüssel, um eine Zahlung zu senden Schaffung Anfrage zu Streifen. Die Streifen der Dokumentation muss details darüber, welche Informationen gesendet werden müssen, um Ihre API-Aufruf, und so wird das, was Informationen, die Sie benötigen, um an den API-Aufruf auf Ihre server. Beachten Sie insbesondere, dass Sie wahrscheinlich zu tun haben, einige zusätzliche grabbing von Preisen usw. in Ihrem token Funktion.

InformationsquelleAutor metasoarous

4

Müssen Sie ein script-tag für das, können Sie nicht verwenden javascript im script-tag mit einer Quelle.
```
<script src="https://checkout.stripe.com/checkout.js" class="stripe-button" data-image="images/button.png" data-key="pk_test_FTZOOu9FL0iYJXXXXXX" data-name="Fund" data-label="DONATE" data-description="ysysys" data-amount="0"></script>
<script type="text/javascript">
    $(function() {
        $('.donate-button').click(function(event) {
            var amount = $('#custom-donation-amount').val();        
            $('.stripe-button').attr('data-amount', amount)
        });
    });
</script>


<input type="number" id="custom-donation-amount" placeholder="50.00" min="0" step="10.00 " />
```
Dies hat das problem der Aktualisierung der Daten-Menge Attribut, aber es hat nicht wirklich ein problem lösen. Der Wert landet in der popup-Formular nach dem Absenden nicht aktualisiert. Nicht sicher, warum, aber es funktioniert nicht.
Hi @metasoarous, hast du eine Lösung für das am Ende? Ich bin jetzt im selben Boot. Kann ich aktualisieren die Daten-Menge richtig, aber die Streifen button zeigt immer noch den ursprünglichen Wert.
Siehe unten meine Antwort; es funktionierte für mich. Eine Frage stellen da, wenn Sie Probleme haben.
Perfekt, jetzt funktioniert es. Danke.

InformationsquelleAutor adeneo
0

Dies möglich ist, um einen Variablen Betrag in der einfachen checkout-Formular. Ich bin mir nicht sicher, welchen Rahmen Sie verwenden, aber ich war in der Lage zu erreichen, das in meiner Rubin (Padrino - nicht-Schienen) - app mit gon Sie wie folgt vor. 'charge_amount_pence' ist eine helper-Methode Rückgabe eines string, der die Bezahlung vorgenommen werden. Re Ihre Besondere Notwendigkeit, dies könnte zu einer Variablen ausgesucht, die von einem Benutzer über eine Ajax-Anforderung, zum Beispiel.
```
<script type="text/javascript">
    window.gon = {};
    gon.charge = charge_amount_pence;
</script>
```
Und in den checkout-Skript:

"data-amount" = gon.charge

Ich benutze eigentlich die gleichen Helfer-Methode in meinem controller, um sicherzustellen, dass der korrekte Betrag tatsächlich berechnet.

InformationsquelleAutor MatzFan

Wie etwa die Schaffung neuer Streifen element? Dieser arbeitete für mich,

<script type="text/javascript">
    $(function() {
        $('.donate-button').click(function(event) {
            var holder = document.getElementById('aNewDiv');
            var script = document.createElement('script');
            script.src = 'https://checkout.stripe.com/checkout.js';
            script.setAttribute('class', 'stripe-button');
            script.setAttribute('data-amount', $('#Amount').val()*100);
            script.setAttribute('data-key',"pk_test_W0ML1BmfFMa6z3MgD90s7WeN");
            script.setAttribute('data-name', "Fund");
            script.setAttribute('data-description', "ysysys");
            script.setAttribute('data-locale', "auto");
        }
    }
</script>

InformationsquelleAutor Kamrul Khan

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.