O'Reilly logo

jQuery UI 1.10: The User Interface Library for jQuery by Dan Wellman, Alex Libby

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Changing the elements in the datepicker UI

The datepicker API exposes a number of options directly related to adding or removing additional UI elements within the datepicker. To show <select> elements that allow the visitor to choose the month and year, we can use the changeMonth and changeYear configuration options:

$("#date").datepicker({
  changeMonth: true,
  changeYear: true
});

Save this as datePicker4.html. Using the month and year <select> elements, gives the user a much quicker way to navigate to dates that may be far in the past or future. The following screenshot shows how the widget will appear with these two options enabled:

Changing the elements in the datepicker UI

By default, ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required