How to display a date as select tag (only day of the week and date of the month)

Question

I am new to javascript or jQuery, I am trying to place a date picker on my website and I am able to place a datepicker with calendar, but I need it without a calendar and as a select box.

Any idea how to do it in javascript or jQuery?

Thanks

Answer 1

You probably aren't going to be able to modify datepicker to do this (I will gladly concede to anyone proving otherwise), but you can easily add dates to a standard select control.

In this code, I have used the formatDate from the datepicker UI, so you'll need to include jQuery UI, or at least the datepicker component, for it to work.

The following example adds 10 days, starting with the current day to a select element with an ID of "mySelect".

$(function () {
    var today = new Date();
    var date = new Date();

    for (x = 0; x <= 9; x++) {
        date.setDate(today.getDate() + x);
        textDate = $.datepicker.formatDate('D, dd-M', date);
        $('#mySelect')
            .append($("<option></option>")
            .attr("value", textDate)
            .text(textDate));
    }
});