如何在 jquery ui select 输入中设置日期

Question

大家晚上好，我创建了一个 JQuery Ui 年月日的日期选择器，代码如下：

  $.datepicker.setDefaults($.datepicker.regional["pt-BR"]);
  $(datePickerId).datepicker({
    changeMonth: true,
    changeYear: true,
    showButtonPanel:true,
    maxDate: "+3m",
    minDate: "-2y",
    onClose: function(dateText, inst) {
      $(this).prop('disabled', true);
      let month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
      let year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
      let givenDate = new Date(year, month, 1);
      $(this).datepicker('setDate', givenDate);
      //Do something with AJAX
    }
  });
  $(datePickerId).datepicker("setDate", "0")

我的问题是，当用户将 select 日期输入是这样的：

这张图片就是一个完美的例子，在这种情况下，用户 select 编辑了 8 月份，但是一旦他再次点击日期选择器，日期选择器就会选择设置的默认日期当它第一次运行时（今天 month/year），当用户 select 是一个新的 month/year 我怎么能让代码“记住”selected在 onClose 方法中然后正确带上它？非常感谢您。

编辑以完整描述我实际想要做的事情：用户打开日历，它以实际的月份和年份开始，用户选择 July/2019，点击确定，AJAX 请求完成到服务器选择给定月份的一些信息，用户再次单击日期选择器，日历显示，当发生这种情况时，月份和年份的输入（参见图像以供参考）应该在 July/2019（最后一个 month/year 用户选择）。

Answer 1

考虑以下示例。

$(function() {
  $("#myDate").datepicker({
    changeMonth: true,
    changeYear: true,
    dateFormat: "MM yy",
    showButtonPanel: true,
    maxDate: "+3m",
    minDate: "-2y",
    onClose: function(dateText, inst) {
      $(this).prop('disabled', true);
      var m = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
      m = parseInt(m) + 1;
      m = (m < 10 ? "0" + m : m);
      var y = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
      var dt = new Date(y + "-" + m + "-01T00:00:01");
      $(this).datepicker( "option", "defaultDate", dt ).datepicker("setDate", dt);
      //Do something with AJAX
      $(this).prop('disabled', false);
    }
  }).datepicker("setDate", "0");
});

.ui-datepicker .ui-datepicker-calendar,
.ui-datepicker .ui-datepicker-buttonpane .ui-datepicker-current {
  display: none;
}

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
Date: <input type="text" id="myDate" />

除了 setDate 您还必须重置 defaultDate。

如何在 jquery ui select 输入中设置日期

How to set date in jquery ui select inputs

javascript

jquery

jquery-ui