Stripe Form Error The 'exp_month' parameter should be an integer (instead, is undefined) and custom form questions -
Stripe Form Error The 'exp_month' parameter should be an integer (instead, is undefined) and custom form questions -
first off, i'm newbie in forgive me if may have inquire lot of questions.
i'm working on stripe payment form. copied , pasted sample code, changing entries based on how understood it. have several concerns/questions:
the error "the 'exp_month' parameter should integer (instead, undefined). checked code , made sure followed suggested solution others' issue similar error. believe have in order i'm still getting issue.
before issue, able submit transactions in testing environment i'm not seeing them on log section of stripe's dashboard. there missing on codes?
i need help in beingness able capture name, address, phone number, email address. added entry fields on form, info not recorded. please help me on well.
i'm sharing codes i'm using:
<!doctype html> <html lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>purchase 1-on-1 private photography course</title> <!-- required stripe lib --> <script type="text/javascript" src="https://js.stripe.com/v2/"></script> <!-- jquery used example; isn't required utilize stripe --> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script type="text/javascript"> // identifies website in createtoken phone call below stripe.setpublishablekey('stripe test publishable key'); var striperesponsehandler = function(status, response) { var $form = $('#payment-form'); if (response.error) { // show errors on form $form.find('.payment-errors').text(response.error.message); $form.find('button').prop('disabled', false); } else { // token contains id, name, last4, , card type var token = response.id; // insert token form gets submitted server $form.append($('<input type="hidden" name="stripetoken" />').val(token)); // , re-submit $form.get(0).submit(); } }; jquery(function($) { $('#payment-form').submit(function(e) { var $form = $(this); // disable submit button prevent repeated clicks $form.find('button').prop('disabled', true); stripe.card.createtoken($form, striperesponsehandler); // prevent form submitting default action homecoming false; }); }); stripe.card.createtoken({ name: $('.customer-name').val(), address_line1: $('.address- line1').val(), address_line2: $('.address-line2').val(), address_city: $('.city-address').val(), address_state: $('.state-address').val(), address_zip: $('.address-zip').val(), email: $('.customer-email').val(), phone_number: $('.phone-number').val(), number: $('.card-number').val(), cvc: $('.card-cvc').val(), exp_month: $('.card-expiry-month').val(), exp_year: $('.card-expiry-year').val() }, striperesponsehandler); </script> </head> <body> <h1>purchase 1-on-1 private photography course</h1> <form action="" method="post" id="payment-form"> <span class="payment-errors"></span> <div class="form-row"> <label> <span>name</span> <input type="text" size="30" data-stripe="name"/> </label> </div> <div class="form-row"> <label> <span>address line 1</span> <input type="text" size="20" data-stripe="address_line1"/> </label> <label> <span>address line 2</span> <input type="text" size="20" data-stripe="address_line2"/> </label> </div> <div class="form-row"> <label> <span>city</span> <input type="text" size="15" data-stripe="address_city"/> </label> <label> <span>state</span> <input type="text" size="2" data-stripe="address_state"/> </label> <label> <span>zip</span> <input type="text" size="5" data-stripe="address_zip"/> </label> </div> <div class="form-row"> <label> <span>email</span> <input type="text" size="20" data-stripe="email"/> </label> </div> <div class="form-row"> <label> <span>phone number</span> <input type="text" size="20" data-stripe="phone_number"/> </label> </div> <div class="form-row"> <label> <span>card number</span> <input type="number" size="20" data-stripe="number"/> </label> </div> <div class="form-row"> <label> <span>cvc</span> <input type="text" size="4" data-stripe="cvc"/> </label> </div> <div class="form-row"> <label> <span>expiration (mm/yyyy)</span> <input type="number" size="2" data-stripe="exp_month"/> </label> <span> / </span> <input type="number" size="4" data-stripe="exp_year"/> </div> <h2>upon submitting payment, charged aud20.00</h2> <button type="submit">submit payment</button> </form> </body> </html>
it looks may have combined incompatible code old tutorials , new tutorials, it's easy plenty fix!
all val() calls you're passing createtoken homecoming undefined value. you're using class accessors (i.e. looking dom element class of address-line1), none of form fields have class attribute; they're using info attributes.
you'll instead want fields via data-stripe attribute:
stripe.card.createtoken({ name: $('input[data-stripe=name]').val(), address_line1: $('input[data-stripe=address-line1]').val(), // etc. while you're making change, double-check you're using same data-stripe value in both form , jquery selector—right there several places 2 don't match. example, form uses address_line1 while jquery looks address-line1.
forms stripe-payments
Comments
Post a Comment