CODEWITHSUNDEEP
jquerydatepicker
user1269625
user1269625

Reputation: 3209

Jquery date picker year order

I have this code here for a Jquery date picker

// Datepicker from jQuery UI plugin
    $birth.datepicker({
    onSelect: function(dateText, inst) { 
        $(this).parent().find("label#error").html("");
        $gender.focus();
    },
        yearRange: '1950:2006',
        changeMonth: true,
    changeYear: true,           
    showOtherMonths: true,          
    selectOtherMonths: true,
    dateFormat: 'yy-mm-dd'
    });
});

My year dropdown starts at 1950 and goes all the way to 2006, I would like to reverse them..

I tried yearRange: '2006:1950' but nothing displayed :(

Is there away to fix this?

Upvotes: 1

Views: 2233

Answers (2)

Imnotapotato
Imnotapotato

Reputation: 5798

Hope this heps, I found a nicer solution and came across your post. If this is still relevant:

jQuery datepicker year dropdown starts from 1900 and I want it to start from the bottom

This is how I solved my problem. and I think this is why jQuery aren't fixing this "Bug" because there is a "way" to get the year started from the last date:

dateFormat: 'mm/dd/yy',
changeMonth: true, 
changeYear: true,  
yearRange: "-70:", 
maxDate: "-13Y"

In comparison to my original code posted here, instead if using yearRange as fixed years yearRange: "1900:-13" it's better to use this from bottom up: "-70:". and set the maxDate. So now I get my year select box starting from 2004 and not 1900.

Hope this helps others out there.

P.S: All the other solutions have been tested. They are very slow, and some don't work so well (especially the old ones - sets current year instead of 2004 for example).

Upvotes: 1

Lereveme
Lereveme

Reputation: 1674

The link supplied is a good solution. Here is another way that is kind of a hack but works: http://plnkr.co/edit/sSdUbqd1pWKyiBOZAMwD?p=preview

$(document).ready(function() {

  var showPicker = false;

  $("#txtBirthday").datepicker({
    onSelect: function(dateText, inst) {
      $(this).parent().find("label#error").html("");
      $gender.focus();
    },
    yearRange: '1950:2006',
    changeMonth: true,
    changeYear: true,
    showOtherMonths: true,
    selectOtherMonths: true,
    dateFormat: 'yy-mm-dd', 
    onClose: function(dateText, inst) {
      showPicker = false;
    }
  });

  $(".ui-datepicker").on("mouseenter", function() {

    if (!showPicker) {
      showPicker = true;

      //Reverse the years
      var dropYear = $("select.ui-datepicker-year");

      dropYear.find('option').each(function() {
        dropYear.prepend(this);
      });

    }

  });

});

Upvotes: 1

Related Questions