jQuery UI - Datepicker - Hide year

I came across this thread in my search for a good way to do this, and here's what i came up with.

in my css i have a

.BirthdayDatePicker .ui-datepicker-year
{
 display:none;   
}

and this is how i set up my datepickers that i don't want to show the year on:

$('.DateTextBox.NoYear').datepicker({
            beforeShow: function (input, inst) {

                inst.dpDiv.addClass('BirthdayDatePicker');
            },
            onClose: function(dateText, inst){
                inst.dpDiv.removeClass('BirthdayDatePicker');
            }
        });

basically i add the class just before it shows, and take it off when it hides it, so that other date pickers on the page arn't affected by it.

just incase anyone ever needs to hide the year only on specific pickers on a page and doesn't want to mess with the internals of jQuery.

I dont think this option is exposed va the api. I belive that the easiest way is to change the stylesheet. Change the ui-datepicker-year class to display: none Another option would be to edit the source so it isnt rendered at all, to do that you can remove this part of the code:

// year selection
if (secondary || !changeYear)
    html += '<span class="ui-datepicker-year">' + drawYear + '</span>';
else {
    // determine range of years to display
    var years = this._get(inst, 'yearRange').split(':');
    var thisYear = new Date().getFullYear();
    var determineYear = function(value) {
        var year = (value.match(/c[+-].*/) ? drawYear + parseInt(value.substring(1), 10) :
    (value.match(/[+-].*/) ? thisYear + parseInt(value, 10) :
    parseInt(value, 10)));
    return (isNaN(year) ? thisYear : year);
    };
    var year = determineYear(years[0]);
    var endYear = Math.max(year, determineYear(years[1] || ''));
    year = (minDate ? Math.max(year, minDate.getFullYear()) : year);
    endYear = (maxDate ? Math.min(endYear, maxDate.getFullYear()) : endYear);
    html += '<select class="ui-datepicker-year" ' +
        'onchange="DP_jQuery_' + dpuuid + '.datepicker._selectMonthYear(\'#' + inst.id + '\', this, \'Y\');" ' +
        'onclick="DP_jQuery_' + dpuuid + '.datepicker._clickMonthYear(\'#' + inst.id + '\');"' +
        '>';
    for (; year <= endYear; year++) {
        html += '<option value="' + year + '"' +
            (year == drawYear ? ' selected="selected"' : '') +
            '>' + year + '</option>';
    }
    html += '</select>';
}

I haven't tried removing the code but it should work. I did try hiding it using css and that does work (in firefox anyway :) )

HTH