Databases
StackOverflow2013
Postsdbo
POajax jquery.validate with stripe payment - combine js
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POajax jquery.validate with stripe payment - combine js
    text
    copied!<p>I am using <a href="https://gist.github.com/1750368" rel="nofollow">Stripe payment system</a> to accept credit cards with jQuery validator for forms all with <code>ajax</code>.<br/> This works for stripe and ajax but the validation doesnt work.<br/> Here's <code>process.php</code> <a href="https://gist.github.com/1750375" rel="nofollow">https://gist.github.com/1750375</a></p> <pre><code>$(document).ready(function() { var payBtn = $('#paymentBtn').click(function(){ Stripe.createToken({ number: $('.card_number').val(), cvc: $('.card_cvc').val(), exp_month: $('.card_expiry_month').val(), exp_year: $('.card_expiry_year').val() }, function(status, response) { if (response.error) { payBtn.removeAttr("disabled"); $(".payment_errors").html(response.error.message); addInputNames(); } else { var token = response['id']; //$("#stripeToken").val(token); var amount = $("#formAmount").val(); $.post( 'process.php', {amount:amount, stripeToken:token},function(data){ $('#recDiv').html(data); }); } }); return false; }); // THIS SECTION BELOW DOES NOT GET CALLED jQuery.validator.addMethod("cardNumber", Stripe.validateCardNumber, "*"); jQuery.validator.addMethod("cardCVC", Stripe.validateCVC, "*"); jQuery.validator.addMethod("cardExpiry", function() { return Stripe.validateExpiry($(".card_expiry_month").val(), $(".card_expiry_year").val()) }, "*"); $("#payment_form").validate({ submitHandler: submit,// this does nothing rules: { "card_cvc" : { cardCVC: true, required: true }, "card_number" : { cardNumber: true, required: true }, "card_expiry_year" : "cardExpiry" } }); }); </code></pre> <p><strong>This works for validation</strong> but then stripe doesnt work because now i have put the <code>.post</code> function, missing all its previous variables from the first example, into this <code>submitHandler</code>.<br/></p> <pre><code>$("#payment_form").validate({ submitHandler: function(form) { $.ajax({ type: 'POST', url: 'process.php', data: $(this).serialize(), success: function(returnedData) { $('#recDiv').append(returnedData);//nothing happens because stripe doesnt work } }); return false; }, rules: { "card_cvc" : { cardCVC: true, required: true }, "card_number" : { cardNumber: true, required: true }, "card_expiry_year" : "cardExpiry" } }); </code></pre> <p><strong>QUESTION:</strong> How can i get the validation to work from the first sample above?</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload