jQuery Calender: Manage Year Range

By | December 27, 2013

calender-month-year

If you are building high interactive web application and want to add calender then jQuery UI is perfect pick for you. jQuery UI gives so many customizable things in calender. As we have seen how to add month and year in calender in previous article. It has +10 year range in jQuery datepicker but you can give cusomizable year range as per your requirement. It’s also pretty simple. You just need to add yearRange:”-10:+10″.

yearRange:”-10:+10″

See you can write any year [1990] instead of -10 or also can give -15,-20,… and same as for +10 i.e for bottom year.

There are some sample code:

yearRange:”-20:2015″
yearRange:”1990:+20″
yearRange:”-20:+20″
yearRange:”1990:2015″

jQuery(‘div’).datepicker({
        changeMonth:true,
        changeYear:true,
        yearRange:”-20:2015″
      });

A full example code: