Search code examples
jquerydatepickeruserscripts

jQuery DatePicker is not changing month/year when used inside a userscript


I figured out how to show the month and year dropdown boxes but nothing happens when I select them. Basically if you select a new month/year it should change to that new month/year. I'm sure I'm doing something wrong but here is what I've got so far:

$("input[name=myDate]").datepicker({
        changeMonth: true,
        changeYear: true,
        showButtonPanel: false,
        dateFormat: 'm/d/yy'
);

The alert isn't even firing. Any help is appreciated.

Update:

I've added below the code someone gave me that I need to use in order to make the date selection fire. If I don't use this code then when I select a day it doesn't go into the text box. Maybe this is affecting the month/year selection?

$("input[name=myDate]").click(function () {
    setTimeout(cleanUpCrappyEventHandling, 100);
});

function cleanUpCrappyEventHandling() {
    var nodesWithBadEvents = $(
        "div.ui-datepicker td[onclick^='DP'], div.ui-datepicker a[onclick^='DP']"
    );
    nodesWithBadEvents.each(function () {
        var jThis = $(this);
        var fubarFunc = jThis.attr("onclick");

        /*--- fubarFunc will typically be like:
        DP_jQuery_1325718069430.datepicker._selectDay('#pickMe',0,2012, this);return false;
        */
        fubarFunc = fubarFunc.replace(/return\s+\w+;/i, "");

        jThis.removeAttr("onclick");
        jThis.click(function () {
            eval(fubarFunc);
            cleanUpCrappyEventHandling();
        });
    });
}

Thanks!


Solution

  • Changing the month and year in the calendar happens automatically in the date picker, you don't need code to do that for you:

    $("input[name=myDate]").datepicker({
        changeMonth: true,
        changeYear: true,
        showButtonPanel: false,
        dateFormat: 'm/d/yy'
        }
    );
    

    Also, I'm not sure I understand what is happening in your onChangeMonthYear event. According to the current documentation, month and year are not options. And even if they are, you are setting them to true, not the new values.

    Here's an example: http://jsfiddle.net/g6EXh/