2015-02-03 2 views
1

Мне интересно, знает ли кто-нибудь, как изменить JQueryUI Datepicker, чтобы обновить текст даты, как только выпадающее меню года изменится.JqueryUI Datepicker year picker не обновляет текст текстового поля

Основы, что я использую показано в http://jsfiddle.net/H94cc/238/

<input type="text" name="DOB" id="DOB" class="cat_textbox datepicker" value="10/10/1976" /> 


// UI Date Picker 
$(".datepicker").datepicker({ 
yearRange: '-80:-04' , 
changeYear: true, 
changeMonth: true 
}); 

$(".datepicker").datepicker({ 

    showOn: "both", 
    buttonImage: "/images/calendar.png", 
    buttonImageOnly: true 
}); 

Если щелкнуть на тексте, а затем выберите год и нажмите где-нибудь еще, не выбирая день снова закрывается без обновления текста.

Кто-нибудь знает, как это исправить?

ответ

2

Используйте onChangeMonthYear событие следующим образом:

<!doctype html> 
    <html lang="en"> 
    <head> 
     <meta charset="utf-8"> 
     <title>jQuery UI Datepicker - On change month,year</title> 
     <link rel="stylesheet" href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css"> 
     <script src="//code.jquery.com/jquery-1.10.2.js"></script> 
     <script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script> 
     <link rel="stylesheet" href="http://jqueryui.com/resources/demos/style.css"> 
     <script> 
     $(function() { 
     var changingDate = false; 
     $('.datepicker').datepicker({ 
      yearRange: '-80:-04' , 
      changeYear: true, 
      changeMonth: true, 
      onChangeMonthYear: function(y, m, i) { 
       var d = i.selectedDay; 
       $(this).datepicker('setDate', new Date(y, m - 1, d)); 
      } 
     }); 
     }); 
     </script> 
    </head> 
    <body> 
    <input type="text" name="DOB" id="DOB" class="cat_textbox datepicker" value="10/10/1976" /> 
    </body> 
    </html> 
+0

Эй, спасибо за предложение. На хроме есть небольшая проблема с функцией, поскольку она позволяет вам дважды щелкнуть по выпадающему году. – Y8sy

+0

На самом деле извините, это похоже на то, что с ним постоянно есть скрипка, так что это не связано с вашим кодом. – Y8sy

0

Используйте событие setDate в datepicker, когда происходит событие изменения.

$target_node.change(function() { 
    $your_date_node.datepicker({your_config}) 
        .datepicker('setDate', your_date); 
}); 
0

В моем случае, из какой-то причине "я" переменная не заселение; Кроме того, это был «datepick()», а не «datepicker()» - не знаю, какой плагин использовался.

Это то, что я начала работать в конце:

var datepicker = $('.datepicker').datepick({ 
     changeYear: true, 
     changeMonth: true, 
     onChangeMonthYear: function (y, m, i) { 
      var date = $(this).datepick('getDate'); 
      var d = date[0].getDate(); 
      $(this).datepick('setDate', new Date(y, m - 1, d)); 
     } 
}); 
Смежные вопросы