jquery DatePicker Nút Done

Question

Có cách nào để xử lý sự kiện nhấn nút "thực hiện" trong jquery UI DatePicker không?

Tôi có một datepicker rằng chỉ cho phép lựa chọn giữa năm và tháng như trong here

Vấn đề là sử dụng sự kiện onClose ngăn cản tôi từ thanh toán bù trừ lĩnh vực này (nếu tôi nhấp vào datepicker bật lên sau đó nếu tôi đóng tháng và năm được chọn hiện tại được đưa vào trường).

Tôi không muốn sử dụng thêm nút "rõ ràng" bên ngoài datepicker, vì vậy tôi mặc dù tôi có thể sử dụng nút Xong.

Answer 1

Như "Done" nút gọi _hideDatepicker chức năng, bạn có thể ghi đè lên nó:

jQuery.datepicker._hideDatepicker = function() { 
    alert('hello'); 
}; 

Answer 2

Có thể:

$('#myInput') 
    .datepicker({ 
     // datepicker options 
    }) 
    .datepicker('widget') 
    .find('.ui-datepicker-close') 
    .on('click', function() { 
     // done button's handler here 
    }); 

Answer 3

Đây là giải pháp hoàn hảo:

$(function() { 
    $('.monthYearPicker').datepicker({ 
     changeMonth: true, 
     changeYear: true, 
     showButtonPanel: true, 
     dateFormat: 'MM yy' 
    }).focus(function() { 
     var thisCalendar = $(this); 
     $('.ui-datepicker-calendar').detach(); 
     $('.ui-datepicker-close').click(function() { 
      var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val(); 
      var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val(); 
      thisCalendar.datepicker('setDate', new Date(year, month, 1)); 
     }); 
    }); 
}); 

CSS:

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

và HTML:

<label for="myDate">Date :</label> 
<input name="myDate" class="monthYearPicker"> 

Xem cách nó làm việc trong jsfiddle này.

Nguồn:http://develop-for-fun.blogspot.com/2013/08/jquery-ui-datepicker-month-and-year.html

Courtesy:THIS và THAT SO câu trả lời đã được kết hợp để thực hiện giải pháp này.

Answer 4

Tôi tìm thấy giải pháp trên một diễn đàn (không thể nhớ vị trí - xin lỗi). Tôi biết đã lâu rồi, nhưng để tìm kiếm trong tương lai :)

Lưu ý: Cần thực hiện thay đổi trong plugin. Bạn chỉ có thể tìm kiếm "onClose:" để tìm nó.

onClose: function (dateText, inst) { 
    function isDonePressed() { 
     return ($('#ui-datepicker-div').html().indexOf('ui-datepicker-close ui-state-default ui-priority-primary ui-corner-all ui-state-hover') > -1); 
    } 
    if (isDonePressed()){ 
     alert('done pressed'); 
    } 
} 

Answer 5

$('#start_date_download').datepicker({ 
    dateFormat:"yy-mm-dd", 
    "autoclose": true, 
    showButtonPanel: true, 
    closeText: 'Clear' 
}).focus(function() { 
    var thisCalendar = $(this); 
    $('.ui-datepicker-close').click(function() { 
     $.datepicker._clearDate($('#start_date_download')); 
    }); 
});