Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Javascript / Jquery Split Variable Into Two for Stripe Integration

I apologize in advance as I am fairly good with PHP, but when it comes to javascript and jquery, I really am a bit clueless. I have the following code, which I edited from the example found here https://gist.github.com/boucher/1750375, and wanted to combine the credit card exp month and year field into one. The issue is splitting them back apart to use with the stripe example code where it creates a token. Obviously the example on github works perfectly but when I attempt to edit, the script doesn't act like anything is wrong but doesn't submit to stripe and retreive the token as before.

$(document).ready(function() {
            $("#payment-form").submit(function(event) {
                // disable the submit button to prevent repeated clicks
                $('.submit-button').attr("disabled", "disabled");
                var expgroup = document.getElementById('date-exp').val;
                var expArray = expgroup.split( '/' );
                var expmm = ( expArray[ 0 ] );
                var expyy = ( expArray[ 1 ] );
                // createToken returns immediately - the supplied callback submits the form if there are no errors
                Stripe.createToken({
                    number: $('.cc').val(),
                    cvc: $('.card-cvc').val(),
                    exp_month: expmm,
                    exp_year: expyy
                }, stripeResponseHandler);
                return false; // submit from callback
            });
        });
like image 732
Joshua Olds Avatar asked Feb 15 '23 18:02

Joshua Olds


2 Answers

This won't work.

var expgroup = document.getElementById('date-exp').val;

use this instead:

var expgroup = $("#date-exp").val()

Also "cc" is id and not a class. You need to use:

$("#cc").val()

and not:

$(".cc").val()
like image 146
Guy Avatar answered Feb 17 '23 07:02

Guy


document.getElementById('date-exp').val

Is a mixture of jQuery and DOM idiom. It should either be:

document.getElementById('date-exp').value

or:

$('#date-exp').val()

Also consider checking that / is actually in the value (ie that expArray.length===2).

like image 42
bobince Avatar answered Feb 17 '23 07:02

bobince