JQuery Datepicker Only For Month and Year

I am using jquery Datepicker UI .I need to display only month and year using this UI. I Got that using the following code:

$(function() {
         $('.date-picker').datepicker( {
        changeMonth: true,
        changeYear: true,
        showButtonPanel: true,
        dateFormat: 'yy-mm',
        onChangeMonthYear: function(dateText, inst) { 
            var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
            var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
            $(this).datepicker('setDate', new Date(year, month, 1));

        }
    });
});

HTML :

<input type='text' id='date' name='eattdate' class='date-picker' value='".$date."' style='width:105px;'>

This works fine and It displays current month and year as default.But i want to make the month and year selected .

Answers


To begin with, I believe you are missing the hiding of the calendar (and I guess you want that, as you only deal with months and years, but I may be wrong). So, if this is indeed you intention, use:

.ui-datepicker-calendar {
    display: none;
}

In your CSS file.

Now, as for the datepicker not opening in the previously selected date, you can introduce a beforeShow, as follows:

$(function() {
     $('.date-picker').datepicker( {
        changeMonth: true,
        changeYear: true,
        showButtonPanel: true,
        dateFormat: 'yy-mm',

        onChangeMonthYear: function(dateText, inst) { 
            var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
            var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();

            $(this).datepicker('setDate', new Date(year, month, 1));
        },

        beforeShow: function() {
            var dateText = $(this).val();
            var isPopulated = dateText.length > 0;

            if (isPopulated) {
                var selectedDate = $.datepicker.parseDate("yy-mm-dd", dateText + "-01");

                $(this).datepicker("option", "defaultDate", selectedDate);
                $(this).datepicker("setDate", selectedDate);
                $(this).datepicker("refresh");
            }
        }
    });
});

I believe this should get you what you want.


Try this:

defaultDate: new Date()

Need Your Help

Read a TCP socket's sequence number using APIs available in PHP?

php sockets tcp

Do any of the APIs available in PHP allow me to read from a TCP socket the TCP state machine's current sequence number?

Permission denied. HttpSocket in Cake php is not working

php cakephp amazon-web-services

I'm getting "Permission denied" when calling HttpSocket.

About UNIX Resources Network

Original, collect and organize Developers related documents, information and materials, contains jQuery, Html, CSS, MySQL, .NET, ASP.NET, SQL, objective-c, iPhone, Ruby on Rails, C, SQL Server, Ruby, Arrays, Regex, ASP.NET MVC, WPF, XML, Ajax, DataBase, and so on.