manshu manshu - 5 months ago 12
jQuery Question

Month not displaying with this jquery

I am trying to get the month element show up on the following html, and it's showing me wrong number, I need to display the name of the month instead of number.

This is my HTML

<div class="card-expiration-date">
<label>Expires</label>
<div></div>
</div>


This is my jQuery

$('#card-expiration-month, #card-expiration-year').change(function(){
m = $('#card-expiration-month option').index($('#card-expiration-month option:selected'));
m = (m < 10) ? '0' + m : m;
y = $('#card-expiration-year').val().substr(2,2);
$('.card-expiration-date div').html(m + '/' + y);
})


This is my code in Laravel 5.2

<fieldset class="fieldset-expiration">
<label for="card-expiration-month">Expiration date</label>
{{ Form::selectMonth(null, null, ['id' => 'card-expiration-month','data-stripe' => 'exp-month']) }}
{{ Form::selectYear(null, date('Y'), date('Y') + 10, null, ['id' => 'card-expiration-year','data-stripe' => 'exp-year'] ) }}
</fieldset>

Answer

I'm guessing, though I don't know for sure, the form elements that you're generating via Laravel and/or Stripe are using a zero based index for the month.

For example:

January = 0
February = 1
March = 2

As far as getting the month name you'll likely need to create an array and use the month index you have. Maybe something like this?

var month_names = [ 'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec' ];
var month_index = $('#card-expiration-month option').index($('#card-expiration-month option:selected'));
var month = month_names[ month_index ];
var year = $('#card-expiration-year').val().substr(2,2);
var expires = month + ' ' + year;