简体   繁体   中英

Linking Jquery-UI datepicker to DropDownlist

Has anyone linked a Jquery ui datepicker to 3 separate to dropdown/select lists (Day Month Year) so that changing the month/year on either the datepicker or dropdowns will restrict the amount of days available in the days dropdown.

Currently I have just a select list with values hard coded to 31, which allows some invalid dates.

I am using c# and mvc.

thank you

Using Jquery UI Datepicker is way over kill for this. Simple use of the javascript date will help you here.

This shows you how to grab the days for the corresponding month. Get number days in a specified month using javascript?

So on month change set the days

function daysInMonth(month,year) {
    return new Date(year, month, 0).getDate();
}

$('#month').change(function(){
    //fill dropdown with options correspinding
    //with the number of days returned from the daysInMonth function
})

How i solved it, if anyone is looking for similar

function disableDaysNotInMonth(daysInMonth) {
    $("#ddlDay option").each(function () {
            if (this.text > daysInMonth) {
                $(this).attr("disabled", true);
            }
            else {
                $(this).attr("disabled", false);
            }
    });
};

function ddlUpdate() {
    var ddlMonth = $("#ddlMonth").find(":selected").text();
    var ddlYear = $("#ddlYear").find(":selected").text();
    var daysInMonth = getDaysInMonth(ddlMonth, ddlYear);
    disableDaysNotInMonth(daysInMonth);
};

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM