datepicker selecting one of several pre-defined date ranges
I need to extend the functionality of the jQuery UI datepicker, and I wanted to ask whether what I'm planning can even be done with the current extension mechanisms in place.
I have an application in mind where what users select is a date range, but it's not just a matter of picking the start and end dates. There are only a few possible ways in which you can select ranges. Imagine you're running a hotel and you have time slots for when people can rent a room. The slots aren't the same time length. One might be 4 days, while another is 3. As an example, consider the way I've carved up the current month.
People can choose one of the four ranges that I have defined. They can't choose to stay in the room from the 7th to the 9th. The example is contrived, I know, but it's a really neat construct because this really is how I need my application to work. This UI would be a lot less error-prone than to just allow users to select start and end date and then validate whether it is a valid range.
Some details about how I would like it to look:
When you hover on a date, the entire range changes appearance through some css class. The one that would normally be used for a single date's hover would be good enough for me, but the whole range needs to light up.
It doesn't matter where in the range the user clicks. Anywhere inside should give me what I need because I can easily check in which range the date is.
The more I think about it, the more I lose hope that I'll be able to pull this off, but I'm still curious what others will think. Any thoughts would be appreciated.
Cheers
I have an application in mind where what users select is a date range, but it's not just a matter of picking the start and end dates. There are only a few possible ways in which you can select ranges. Imagine you're running a hotel and you have time slots for when people can rent a room. The slots aren't the same time length. One might be 4 days, while another is 3. As an example, consider the way I've carved up the current month.
People can choose one of the four ranges that I have defined. They can't choose to stay in the room from the 7th to the 9th. The example is contrived, I know, but it's a really neat construct because this really is how I need my application to work. This UI would be a lot less error-prone than to just allow users to select start and end date and then validate whether it is a valid range.
Some details about how I would like it to look:
When you hover on a date, the entire range changes appearance through some css class. The one that would normally be used for a single date's hover would be good enough for me, but the whole range needs to light up.
It doesn't matter where in the range the user clicks. Anywhere inside should give me what I need because I can easily check in which range the date is.
The more I think about it, the more I lose hope that I'll be able to pull this off, but I'm still curious what others will think. Any thoughts would be appreciated.
Cheers