javascript - 当旧日期选择器关闭时打开新日期选择器

Question

我正在使用一个名为 datepicker 的自定义 JS 库，您可以找到 here .

我已经设置并运行它，但我需要它的一些额外功能，而且我完全不知道如何完成它。

这是我到目前为止所拥有的:

<h:panelGroup>
    <h:panelGrid>
        <input id="depatureDate" value="Departure date" class="datepicker dp1"></input>
        <script>
            $(".datepicker, dp1").pickadate({
                format: "dd/mm/yyyy",
                formatSubmit: "dd/mm/yyyy"
            })
        </script>
    </h:panelGrid>
    <h:panelGrid id="returnDate">
        <input value="Return date" class="datepicker dp2"></input>
        <script>
            $(".datepicker, dp2").pickadate({
                format: "dd/mm/yyyy",
                formatSubmit: "dd/mm/yyyy"
            })
        </script>
    </h:panelGrid>
</h:panelGroup>

我需要做的是:

如果单击第一个日期选择器的输入并选择了日期，则该日期选择器需要关闭(它已经这样做了，所以没问题)，并且需要打开第二个日期选择器，并标记第一个日期选择器中选择的日期在上面。然后，用户必须在第二个日期选择器上选择另一个日期

如果有人知道如何做到这一点，我们非常欢迎建议和指示!

Answer 1

好的，我在这里做了一个小例子，处理关闭事件。

<input type="text" class="datepicker1" />
<br />
<input type="text" class="datepicker2" />
<script type="text/javascript">
    // init second picker
    var $input = $('.datepicker2').pickadate();    
    // init first picker
    $('.datepicker1').pickadate({
        // handle close event
        onClose: function() {
            var picker = $input.pickadate('picker');
            // set unix timestamp to the second picker
            // maybe theres a better solution for this...currenlty it works
            picker.set('select', this.component.item.select.pick );
            picker.open();
        }
    });

</script>

不要忘记加载所有pickadate库和jquery......我已经定义了 2 个带有分类 datepicker1 和 datepicker2 的 div。然后我正在创造日期选择器对象。 datepicker1 对象处理 onClose 事件。当第一个日期选择器关闭时，脚本将打开第二个日期选择器并设置 datepicker1 的值...

希望这有帮助

干杯