【问题标题】:change the second datepickers minDate when selecting date from another datapicker从另一个日期选择器中选择日期时更改第二个日期选择器 minDate
【发布时间】:2014-01-09 12:44:11
【问题描述】:

我正在使用 jquery ui datepicker。

我在页面上有两个日期选择器,从日期选择器和到日期选择器

当我在一个日期选择器中选择一个日期时,我会将最大和最小日期更新到第二个日期选择器。

我的问题是,就在它关闭(隐藏)选定的日期选择器之前, 它显示第二个日期选择器而不是第一个(就在我更新第二个日期选择器的最小日期时)然后关闭它。

为什么当我从另一个日期选择器更新最小日期时它显示第二个日期选择器?

如何在更新第二个日期选择器之前隐藏日期选择器?

 <!doctype html>
<html >
<head>

  <link rel="stylesheet" href="//code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
  <script src="//code.jquery.com/jquery-1.9.1.js"></script>
  <script src="//code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

</head>
<body>

<input name="fromDateCalendar" type="text" value="10/12/2013" id="fromDateCalendar" style="width:100px;" />     

 <input name="toDateCalendar" type="text" value="09/01/2014" id="toDateCalendar" style="width:100px;" />    

<script>

    $(function () {
        $('#fromDateCalendar').datepicker({
            onSelect: function (date) {change1(date);}});

        $("#toDateCalendar").datepicker({
            onSelect: function (date) {change2(date);}, maxDate: '0' });
    });

    function change1(date) {
        $('#toDateCalendar').datepicker('option', 'minDate', date);}

    function change2(date) {
        $('#fromDateCalendar').datepicker('option', 'maxDate', date);}


</script> 

</body>
</html>

【问题讨论】:

  • 你的代码中有语法错误,修复它们并提供一个小提琴!
  • 无法正确理解您的需求
  • 更新代码没有错误但还是同样的问题
  • 问题是当我在第一个 datpicker 中选择一个日期时,我更改了第二个日期选择器的最小日期,就在第一个 datepicker 关闭之前它显示第二个 datepicker(而不是第一个)片刻,然后关闭它。
  • 我无法理解您要完成的工作。以jsFiddle 为例(这是故意破坏的)。在您从第一个 datepicker 中选择一个日期后,它会将焦点设置到下一个日期,并且日历会非常快速地打开和关闭。这是你遇到的问题吗?下一个datepicker 关闭太快?或者您是说您只想在页面上显示一个datepicker,并且只有在选择了日期之后您才想显示第二个datepicker?或者您希望自动填充第二个日期?

标签: javascript jquery jquery-ui date datepicker


【解决方案1】:

解决当我更改最大日期时显示#2 日期选择器片刻(代替#1 日期选择器)的问题, 我在 #1 datepicker close with setTimeout 之后调用 ....datepicker('option', 'minDate', start)

 onSelect: function (date) {                                                  
                             setTimeout(function () {
                                 ....datepicker('option', 'minDate', start)
                             }, 300)
                        }....

【讨论】:

    猜你喜欢
    • 2015-08-07
    • 1970-01-01
    • 2021-05-19
    • 2019-07-25
    • 1970-01-01
    • 1970-01-01
    • 2012-09-19
    • 1970-01-01
    • 2020-01-22
    相关资源
    最近更新 更多