Verhindern Stripe Form von Vorlage

Question

Ich entwickle eine Website, in die ich Stripe-Payment-Gateway integrieren möchte. Ich implementiere diesen Code bereits auf einer anderen Website, aber dieser Code funktioniert nicht auf meiner aktuellen Website. Ich weiß nicht warum. Mein Code folgt

-Code

<script type="text/javascript" src="https://js.stripe.com/v2/"></script> 
<script type="text/javascript"> 
    Stripe.setPublishableKey('API_KEY'); 
</script> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script> 
<script> 
$(document).ready(function(){ 

     var $form = $('#paymentform'); 

     $form.submit(function(event) { 
     event.preventDefault(event); 
     $form.find('#pay_submit').prop('disabled', true); 

     Stripe.card.createToken($form, stripeResponseHandler); 

     return false; 
    }); 

}); 

function stripeResponseHandler(status, response) { 
    var $form = $('#payment-form'); 

    if (response.error) { 

     $form.find('.payment-errors').text(response.error.message); 
     $form.find('#pay_submit').prop('disabled', false); 

    } else { 

     var token = response.id; 

     $form.append($('<input type="hidden" name="stripeToken">').val(token)); 

     $form.get(0).submit(); 
    } 
    }; 
</script> 

<form action="stripe.php" class="contact-form col-md-8 col-md-offset-2" method="POST" id="paymentform"> 
    <span class="payment-errors"></span> 

    <label for="company-name">Company Name:</label> 
    <input type="text" class="form-control" id="company-name" name="company_name" required> 

    <label for="name">Your Name:</label> 
    <input type="text" class="form-control" id="name" name="name" required> 

    <label for="email">Email:</label> 
    <input type="email" class="form-control" id="email" name="email" required> 

    <label for="Phone">Phone:</label> 
    <input type="text" class="form-control" id="Phone" name="phone" required> 

    <label for="City">City:</label> 
    <input type="text" class="form-control" id="City" name="city" required> 

    <label for="stations">Address:</label> 
    <input type="text" class="form-control" id="stations" name="stations" required> 

    <label for="Card">Credit Card #:</label> 
    <input type="text" size="20" data-stripe="number" class="form-control" id="Card" required> 

    <label for="cvc">CVC:</label> 
    <input type="text" size="4" data-stripe="cvc" class="form-control" id="cvc" required> 

    <label for="exp_month">Expiry Month(MM):</label> 
    <input type="text" size="2" data-stripe="exp_month" class="form-control" id="exp_month" required> 

    <label for="exp_year">Expiry Year(YY):</label> 
    <input type="text" size="2" data-stripe="exp_year" class="form-control" id="exp_year" required> 

    <button type="submit" class="btn btn-default btn-lg getS-btn" id="pay_submit">PAY</button> 
</form> 

Andere Skripte am Ende der gleichen Seite, die ich für verschiedene Anwendungen sind

<script type="text/javascript" src="js/jquery.1.11.1.js"></script> 
<script type="text/javascript" src="js/bootstrap.js"></script> 
<script type="text/javascript" src="js/SmoothScroll.js"></script> 
<script type="text/javascript" src="js/jquery.prettyPhoto.js"></script> 
<script type="text/javascript" src="js/jquery.isotope.js"></script> 
<script type="text/javascript" src="js/jqBootstrapValidation.js"></script> 
<script type="text/javascript" src="js/contact_me.js"></script> 
<script type="text/javascript" src="js/main.js"></script> 

Ich denke, jquery nicht von der Form Vorlage verhindert, deshalb funktioniert api nicht.

Answer 1

Es scheint, Fehler in Ihrem jquery (bedeutet jquery Fehler generiert), weil sie Form verhindert nicht. Überprüfe es sorgfältig auf deiner Entwicklungsseite.

Answer 2

Sie können eine Formularübermittlung verhindern, indem Sie diesen sauberen Trick für die onSubmit() - Methode für das Formular-Tag verwenden.

Beispiel:

<form action="stripe.php" class="contact-form col-md-8 col-md-offset-2" method="POST" id="paymentform" onSubmit="return false;">