Remembering the last selected month in jQuery UI datepicker for multiple fields

I have a page with multiple datepicker fields using the standard jQuery user interface. I would like to set the default datepicker date for the last selected day or month for all empty fields, so the user does not need to manually change the month for each selected datepicker.

I tried to save the date value in a variable using the onSelect datepicker function, but I don’t know how to associate the defaultDate property so that it updates all finalists with any last selected date.

Below is the base code. Again, if the user sets one of the date text fields until 10/20/2011, when he or she opens the other datepicker through any of the empty text fields, the datepicker should show the month of October by default (not today's current date).

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/jquery-ui.min.js"></script> <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.0/themes/blitzer/jquery-ui.css" /> <script type="text/javascript"> $(document).ready(function() { $(".datepicker").datepicker({ changeMonth: true, changeYear: true }); }); </script> </head> <body> <input type="text" class="datepicker" /> <br /> <input type="text" class="datepicker" /> <br /> <input type="text" class="datepicker" /> <br /> <input type="text" class="datepicker" /> <br /> <input type="text" class="datepicker" /> </body> </html> 
+4
source share
1 answer

What about:

 $(".datepicker").datepicker({ changeMonth: true, changeYear: true, onSelect: function(dateText, inst) { $(".datepicker").datepicker("option", "defaultDate", dateText); } }); 

Using the defaultDate parameter and the onSelect event.

Here is a working example: http://jsfiddle.net/MXHdj/

+3
source

All Articles