【问题标题】:Disable selection jQuery Datepicker field?禁用选择jQuery Datepicker字段?
【发布时间】:2012-09-26 12:55:07
【问题描述】:

我正在使用 jQuery UI Datepicker 制作一个包含两个字段的提交表单。我希望用户创建一个范围并提交它以查看结果。但是,他们显然无法选择比结束日期更近的开始日期(您看不到从今天开始到昨天的范围)。 到目前为止,如果第一个发生在它之前,我已经能够在选择第二个时发出警报,但我不知道如何让日期选择器保持打开状态,以便用户可以选择其他内容。

这是我目前的代码:

<script>
    $(document).ready(function() {
        $(".datepicker_start").datepicker({
            maxDate: '+0d',
            onSelect: function(dateText, inst) {

        }
        });
        $(".datepicker_to").datepicker({
            maxDate: '+0d',
            onSelect: function(dateText, inst) {
                 var startDate = $('.datepicker_start').val();
                $(this).attr('value', dateText)
                if (startDate > dateText) {
                    alert('not cool!');
                }
        }
        });
    });
</script>

有人知道我会怎么做吗?我尝试返回 false,但它仍然将错误的日期推送到该字段:(

【问题讨论】:

标签: javascript jquery jquery-ui datepicker uidatepicker


【解决方案1】:
$(function() {
    $( "#from" ).datepicker({
        defaultDate: "+1w",
        changeMonth: true,
        numberOfMonths: 3,
        onSelect: function( selectedDate ) {
            $( "#to" ).datepicker( "option", "minDate", selectedDate );
        }
    });
    $( "#to" ).datepicker({
        defaultDate: "+1w",
        changeMonth: true,
        numberOfMonths: 3,
        onSelect: function( selectedDate ) {
            $( "#from" ).datepicker( "option", "maxDate", selectedDate);
        }
    });
});

来自:http://jqueryui.com/demos/datepicker/date-range.html

【讨论】:

    【解决方案2】:
      $(function () {
            $("#fromdate").datepicker({
                onClose: function (selectedDate) {
                    $("#todate").datepicker("option", "minDate", selectedDate);
                }
            });
            $("#todate").datepicker({
                onClose: function (selectedDate) {
                    $("#fromdate").datepicker("option", "maxDate", selectedDate);
                }
            });
        });
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2021-01-05
      • 1970-01-01
      • 1970-01-01
      • 2010-10-25
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2017-05-11
      相关资源
      最近更新 更多