JQuery DatePicker show only the Month and Year

I have created a report search form that filter the monthly record of sales. So I don't really care about the specific day but the month.

Jquery has a nice DatePicker library, but it can't be customized to remove the month part, so just hide it with this code:

 $(".monthPicker").datepicker({
  dateFormat: 'yy-mm',
  changeMonth: true,
  changeYear: true,
  showButtonPanel: true,

  onClose: function (dateText, inst) {
    var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
    var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
    $(this).val($.datepicker.formatDate('yy-mm', new Date(year, month, 1)));
  }
});

$(".monthPicker").focus(function () {
  $(".ui-datepicker-calendar").hide();
  $("#ui-datepicker-div").position({
    my: "center top",
    at: "center bottom",
    of: $(this)
  });
});

Note: While I customized the code to my liking, it's not my original. It came from several google source.
JQuery DatePicker show only the Month and Year JQuery DatePicker show only the Month and Year Reviewed by Edward Legaspi on Tuesday, July 19, 2011 Rating: 5

1 comment:

Iti Tyagi said...

Thank you so much, just got what I wanted, Keep up the good work.

Powered by Blogger.