CODEWITHSUNDEEP
javascriptjqueryhtmljquery-uidatepicker
Linga
Linga

Reputation: 10563

JQuery datepicker yearrange

I have 2 datepickers like this

<input type="text" class="datepicker" data-year-range="2010:2016"/>
<input type="text" class="datepicker" data-year-range="2000:2020"/>

I have to define the yearRange for the 2 datepickers in configuration. So, I did like this.

$('.datepicker').datepicker({
    changeYear: true,
    // $(this) isn't working here
    //yearRange : $(this).attr('data-year-range'),
    yearRange : $('.datepicker').attr('data-year-range')
});

But it is taking only 2010:2016 for the two datepickers. I don't understand why. The idea is to use different date ranges for the datepickers. Is it possible or do I need to define different datepickers?

Also, In datepickers is it possible to add the yearRange in html instead of the datepicker configuration?

Here is the fiddle

Upvotes: 3

Views: 851

Answers (2)

Bhushan Kawadkar
Bhushan Kawadkar

Reputation: 28513

Try this : use $(this) instead of $('.datepicker')

$('.datepicker').each(function(){
    $(this).datepicker({
        changeYear: true,
        yearRange : $(this).data('year-range')
    });
});

JSFiddle Demo

Upvotes: 1

vijayP
vijayP

Reputation: 11502

You can do it in following way:

https://jsfiddle.net/m5fvc22f/16/

$(document).ready(function() {
     $('.datepicker').each(function() {
       $(this).datepicker({
         changeYear: true,
         yearRange: $(this).data('year-range'),
       });
     })
   })

Upvotes: 7

Related Questions