JqueryUI Datepicker 年份选择器不更新文本框文本

Question

我想知道是否有人知道更改 JQueryUI 日期选择器以在年份下拉列表更改后立即更新日期文本的方法。

我使用的基础知识显示在 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
});

如果您单击文本，然后选择年份，然后单击其他地方而不再次选择日期，它会关闭而不更新文本。

有谁知道如何解决这个问题？

Answer 1

在更改事件发生时，在日期选择器中使用 setDate 事件。

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

Answer 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>

Answer 3

在我的例子中，由于某些原因 "i" 变量没有填充；它也是 "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));
       }
});

JqueryUI Datepicker 年份选择器不更新文本框文本

JqueryUI Datepicker year picker not updating textbox text

jquery

jquery-ui

datepicker