I am looking for a Javascript-based date picker that would allow me to display one week only (instead of the current month).

Ideally it should be one that can be expanded to a full month view if necessary and back again.

Also, (css based?) design customizability would be a plus.

A jQuery solution would be preferred. I've had a brief look at the jQuery datepicker, but it seemed to me that it can only display full months. Please let me know if I am wrong.

I am looking for a Javascript-based date picker that would allow me to display one week only (instead of the current month).

Ideally it should be one that can be expanded to a full month view if necessary and back again.

Also, (css based?) design customizability would be a plus.

A jQuery solution would be preferred. I've had a brief look at the jQuery datepicker, but it seemed to me that it can only display full months. Please let me know if I am wrong.

• javascript
• jquery
• datepicker

Share Improve this question Follow edited Jun 1, 2016 at 13:38 rene 42.5k7878 gold badges121121 silver badges165165 bronze badges asked Mar 16, 2009 at 19:54 Adrian GrigoreAdrian Grigore 33.3k3636 gold badges133133 silver badges215215 bronze badges 1

• Adrian, it seems you had asked this question in 2009. Now it's 2014 past mid... Have you found any better alternatives to achieve this? I have a requirement to build just one week calendar stripe(navigatable to past and present by week number). Any tips and ideas? – bonCodigo Commented Jul 17, 2014 at 6:44

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 3

The jQuery UI datepicker, as has been noted, can not easily be configured to display only one week. You can however use the maxDate and minDate configuration options to constrain the user's input. Here is an example of this functionality.

To answer your specific question, I am not aware of any datepicker control which will only display one week.

I'm not sure, but maybe you can customize this http://jqueryui./demos/datepicker/

Ones that show just one week I know none :(

Edit: After inspect, it shows to be CSS based, I've run through it's options but couldn't find anything just to show one week. Rather there is one which allows you to select only one week though, I don't know what the supposed effect is though.

A date picker widget is overkill if you only have seven options. Just use a dropdown. A neat JavaScript trick is that you can add 1 day to any date and it will handle month/year rollovers automatically. The following code will always give you the next 7 days (starting with today):

var dates = [new Date()];
for (var i = 1; i < 7; i++) dates.push(new Date(dates[0].getYear(), dates[0].getMonth(), dates[0].getDate() + i));