【问题标题】:Using altFormat and altField in jquery UI datepicker range在 jquery UI datepicker 范围内使用 altFormat 和 altField
【发布时间】:2012-05-16 04:12:49
【问题描述】:

我正在尝试获取“从”和“到”的日期范围以将其添加到我的数据库中。我使用 altFormat 和 altField 以 DB 格式 (yy-mm-dd) 捕获日期,同时使用 Datepicker jquery UI 组件在 UI 中显示正常的日期格式。

我的问题是:如何在 Datepicker UI 范围内使用它。在哪里可以为我的 from 和 to 日期选择器指定 altField?

http://jqueryui.com/demos/datepicker/#date-range

我的代码:

var dates = $( "#hotel_display_checkin_date, #hotel_display_checkout_date" ).datepicker({
        defaultDate: "+1w",
        changeMonth: true,
        numberOfMonths: 1,
        altFormat: "yy-mm-dd",
        altField: "#hotel_checkin_date",
        onSelect: function( selectedDate ) {
            var option1 = this.id == "hotel_display_checkin_date" ? "minDate" : "maxDate",

                instance = $( this ).data( "datepicker" ),
                date = $.datepicker.parseDate(
                    instance.settings.dateFormat ||
                    $.datepicker._defaults.dateFormat,
                    selectedDate, instance.settings ),
                    options = {option1: date}
            dates.not( this ).datepicker( "option", options );
        }
        });

我尝试将 altField 选项添加到 options = {option1: date},但这不起作用

【问题讨论】:

    标签: jquery jquery-ui datepicker jquery-ui-datepicker


    【解决方案1】:

    您的主要问题是您尝试对入住和退房日期使用相同的altField

    altField: '#hotel_checkin_date'
    

    如果分别绑定:

    var opts = {
        defaultDate: "+1w",
        changeMonth: true,
        numberOfMonths: 1,
        altFormat: "yy-mm-dd"
        onSelect: function(selectedDate) { ... }
    };
    
    $('#hotel_display_checkin_date').datepicker(
        $.extend({
            altField: '#hotel_checkin_date'
        }, opts)
    );
    $('#hotel_display_checkout_date').datepicker(
        $.extend({
            altField: '#hotel_checkout_date'
        }, opts)
    );​
    

    这样您就可以指定单独的altFields,然后事情应该会更好。

    演示:http://jsfiddle.net/ambiguous/bJ8bh/1/

    【讨论】:

    • 感谢 jsfiddle 演示。我现在真的明白 jquery.extend() 的使用了。
    • @swordfish:请记住 $.extend 修改了它的第一个参数,所以你会看到很多 x = $.extend({}, ...) 使用的东西。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多