Dropdown menu with JavaScript date objects?

I'd like to have a dropdown (select) menu which has dates (e.g. June 21) as options. When the user selects a date from the dropdown, hours of operation will be displayed (somewhere) for that particular day. Currently the hours of operation are displayed for the present day only; this is accomplished through JavaScript date objects.

I'm wondering if it would be possible to take a selected dropdown menu option, convert it somehow into a proper date format, and then run it through the curr开发者_StackOverflowent function I have now, which takes as its argument only the current month and day.

More importantly, if anyone has any ideas about a better way to do something like this, even a link to some relevant information, I'd greatly appreciate it. Right now, I don't really know of any examples I could try to emulate.

You could generate the data on the server so that the options display the date as '21 June' or whatever and have the opening hours as the value. Or the value can be "21june" or similar with a related object that uses the value as a key and hours as the value:

var openingHours = {
    '21June' : '08:00am - 05:30pm',
    '22June' : '08:00am - 09:00pm',
    ...
}

and so on. Then just use the value of the selected option to get the opening hours. There are many other ways to approach this, it depends on how variable the hours are and how many dates you want to cover.

Most businesses just publish weekly hours and special notices for public holidays.

Do the hours of operation vary from week to week? Why not change the drop-down to days of the week (Monday, Tuesday, etc), modify the JS function to take an integer indicating day of the week, and then just modify each <option> element so that it has an onclick event binding, calling the JS function with the appropriate integer day number?

Example:

<select>
  <option onclick="showHoursOfOperation(0);">Sunday</option>   
  <option onclick="showHoursOfOperation(1);">Monday</option>
  <option onclick="showHoursOfOperation(2);">Tuesday</option>
  [ ... ]
</select>

EDIT: Perhaps a more graceful solution, stolen from @ibu. (untested, might not work)

<select onchange="showHoursOfOperation(this.selectedIndex);">
  <option>Sunday</option>
  <option>Monday</option>
  [ ... ]
</select>