0

我正在使用一个名为 datepicker 的自定义 JS 库，你可以在这里找到它。

我已经设置好它并且可以工作了，但是我需要一些额外的功能，我完全不知道如何完成它。

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

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

我需要做的是以下几点：

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

如果有人知道如何做到这一点，建议和指点将非常受欢迎！

4

2 回答 2

1

datepicker 提供了一个关闭事件，也许你可以使用它？看看这里的 API http://amsul.ca/pickadate.js/api.htm#method-on 再往下看，你会发现

$('.datepicker').pickadate({
onOpen: function() {
    console.log('Opened up!')
},
onClose: function() {
    console.log('Closed now')
},
onRender: function() {
    console.log('Just rendered anew')
},
onStart: function() {
    console.log('Hello there :)')
},
onStop: function() {
    console.log('See ya')
},
onSet: function(event) {
    console.log('Set stuff:', event)
}
})

进入关闭事件时，打开一个新的日期选择器并设置当前关闭的默认值。

于 2013-08-30T15:05:05.713 回答
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。然后我正在创建 datepicker 对象。datepicker1 对象处理 onClose 事件。当第一个 datepicker 关闭时，脚本打开第二个并设置 datepicker1 的值...

希望这可以帮助

干杯

于 2013-08-30T18:09:20.223 回答