Getting [object] when passing parameter to javascript function

Question

I have the following function that takes three arguments.

initializeDateDropdown("year", "month", "day");

    function initializeDateDropdown(year1,month1,day1) {
        var currentYear = new Date().getFullYear();
        $("#"+year1).append(function () {
            var yearList = '';
            for (var i = 1951; i <= currentYear; i++) {
                yearList += '<option value="' + i + '">' + i + '</option>';
            }
            return yearList;
        }).val(currentYear)
      .add($('#'+month1).val(new Date().getMonth()))
      .bind('change', showDays);

        showDays(year1, month1, day1);

        $('#'+day1).val(new Date().getDate());


    }

In the definition of the showDays() method, when I try to display the year1, I keep getting [object] [object] and month1 and day1 as undefined .

Can anybody tell me what is wrong with this code?

Below is the showDays method defination.

function showDays(year, month, day) {
        alert(year);
        var days = new Date($("#" + year).val(), parseInt($('#' + month).val(), 10) + 1, 0).getDate();

        var prevSelectedDate = $('#' + day).val();
        $('#' + day).empty();
        for (var i = 1; i <= parseInt(days, 10) ; i++) {
            $('#' + day).append($('<option />', { text: i, value: i }));
        }

        $('#' + day).val(prevSelectedDate);
    }

Please help me with this.

Answer 1

When you do .bind('change', showDays) , this is the equivalent:

.bind('change', showDays(event));

Where event is the event object .

You'll need to change that part of the function to:

.bind('change', function(){
    showDays(year1, month1, day1);
});

Since you need to pass parameters to the function ( year1 , month1 , day1 ), you need to wrap it in an anonymous callback function.

On a secondary note, .bind is deprecated . Use .on() :

.on('change', function(){
    showDays(year1, month1, day1);
});