jQuery ui datepicker, select range of whole weeks only - javascript

I need to create a jQuery ui datepicker that will let users choose a start week of the year, and an ending week of the year. IE: Always Sunday - Saturday. Is this possible?

DatePicker can restrict a user's selection, but only as far as restricting the user between two dates (minDate and maxDate options). As far as I'm aware, there's no built in functionality that can restrict selection to only Sundays or Saturdays.
DatePicker does however have a means of calculating the week of a user's selection with the following snippet of code:
$.datepicker.iso8601Week(new Date(dateText))
You can see how this could be utilised in the following jsFiddle (read below, first).
The only problem with this is that the ISO-week always starts with a Monday. So even though in the demo above I have set Sunday to be the first day of the week, if you try selecting the date Wed 7th March 2012 you'll see in the datapicker it shows as week 9, where the ISO-week will return 10. I left it in on purpose to show you this pitfall.
Although this doesn't provide a direct solution to your problem, hopefully it'll help in determining if you should use DatePicker at all to produce your desired functionality.
edit
Actually, just found this question which might be of use to you, looks like it's possible : Can the jQuery UI Datepicker be made to disable Saturdays and Sundays (and holidays)?

Related

Is there a way to specify specific dates with #react-native-community/datetimepicker?

I'm using the "#react-native-community/datetimepicker" library to add a date/time picker in my React Native app. I want to be able to specify specific dates to be used in the picker, but I can't find any information on how to do this (or if it's possible) in the documentation.
An example could be when a user opens it the selectable dates are February 7th, February 9th, and February 10th. Right now, I only see the option to set a minimum and a maximum date which creates a range.

How can I design a calendar where one can switch between month and dates within a month using FullCalendar?

I want to be able to switch between a month and dates within a month in my application using the FullCalendar plugin. How can I achieve that? I am attaching the screenshot of the UI of how I want it to somewhat look like so that the user can switch between a given month or a date within a month.
Any suggestions/guidance will be highly appreciated :)

Disable current + next 3 working days [duplicate]

This question already has answers here:
Closed 11 years ago.
Possible Duplicate:
Can the jQuery UI Datepicker be made to disable Saturdays and Sundays (and holidays)?
I am using jQuery Datepicker.
What i want to do is select a delivery date of today, or tomorrow -
1) It is supposed to blank out the next 3 working days ie if I order Monday my earliest delivery date to choose is Friday.
2) Disable December 20th to 27th 2011 as options
3) Weekends has to be disable
4) all UK holidays has to be disabled
Can this be done? If so, how?
The minDate option enables you to select a minimum date.
Computing the next business day is more complicated, especially if you want to factor in regional holidays. That will require some kind of server-side code, since it's impossible to determine programmatically if a holiday is coming up.
However, if it's a short-term solution you need (i.e. just between now and the end of the Christmas shopping season), I would simply hard-code an array of valid business days which can be fed into JavaScript's Date object. Loop through that array, find the first date which is greater than today's date, and add two to the index to get "three business days from now".

jQuery Datepicker beforeShowDay - range selected

I'm doing a website for an hotel, and I'm trying to do a datepicker to book the days that somebody wants to stay there.
http://jsfiddle.net/newpatriks/PmPGV/
Here you have that I have done, but I've some problems:
I don't know why, but when the users select the range days, the calendar starts from the month that contains the "end day" choosen.
The css run ok for the .temp_1, but not going well for the .temp_2 and .date_selected (I'm going crazy about this...)
Thanks a lot :)
JQuery Datepicker has a built in range select: datepicker/date-range.
Here is an example from the following question: jQuery datepicker- 2 inputs/textboxes and restricting range

Javascript date picker for displaying one week only?

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.
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.com/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, dunno 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));

Categories

Resources