How to initialize jQuery UI datepicker to date from query string?

Given this markup:

// Calendar.html?date=1/2/2003 <script> $(function() { $('.inlinedatepicker').datepicker(); }); </script> ... <div class="inlinedatepicker" id="calendar"/> 

This will display the built-in datepicker with very little effort (awesome!). How to configure datupik for the date passed through the query string?

Please note that in this case I do not have an input field - only a calendar attached to the div.

+4
source share
3 answers

This should work, although you may run into locale issues (specifically M / D / Y vs. D / M / Y).

 var date = location.match(/(?:\?|&)date=(\d+\/\d+\/\d+)(&|$)/)[1]; $('.inlinedatepicker').datepicker().datepicker("setDate", new Date(date)); 
+10
source

in addition to @Ben Blank answer you can use defaultDate like this

 var date = location.match(/(?:\?|&)date=(\d+\/\d+\/\d+)(&|$)/)[1]; $('.inlinedatepicker').datepicker({defaultDate:new Date(date)}); 
+2
source

I managed to do this with

 $('.inlinedatepicker').datepicker().datepicker("setDate", new Date(2011,11,01)); // Date equals December 1, 2011. 

I had to subtract one of the month to get the correct date, as it seems that the date starts from zero (0 = January)

+1
source

All Articles