2个输入/文本框和限制范围
我使用带有两个输入框的jQuery Datepicker小部件,一个用于“From”日期,另一个用于“To”日期。 我使用jQuery Datepicker功能演示作为获取两个输入框互相协作的基础,但我需要能够添加这些附加限制:
日期范围不得早于2008年12月1日
“到”日期不能晚于今天
一旦一个“开始”日期被选择时,“到”日期只能是“从”日期之后的范围为7天内
如果首先选择“收件人”日期,则“发件人”日期只能在“至”日期前的7天范围内(限制12月01日为第一个可选日期)
我似乎无法让所有上述工作在一起。
总之,我希望能够在12月1日到今天之间选择长达7天的范围(我意识到我在12月1日发布此消息,因此只能在今天获得)。
我的代码到目前为止
$(function () {
$('#txtStartDate, #txtEndDate').datepicker(
            {
            showOn: "both",
            beforeShow: customRange,
            dateFormat: "dd M yy",
            firstDay: 1, 
            changeFirstDay: false
            });
});
function customRange(input) 
{ 
return {
         minDate: (input.id == "txtStartDate" ? new Date(2008, 12 - 1, 1) : null),
         minDate: (input.id == "txtEndDate" ? $("#txtStartDate").datepicker("getDate") : null), 
         maxDate: (input.id == "txtStartDate" ? $("#txtEndDate").datepicker("getDate") : null)
       }; 
}
我错过了7天范围限制,并且在2008年12月1日之前或今天之后阻止了“至”日期选择。 任何帮助将不胜感激,谢谢。
非常感谢您的帮助本,我已经建立在您的帖子上,并拿出了这个。 它现在完成并且出色地工作!
这是一个工作演示 。 添加/编辑到URL以查看代码
完整的代码如下 -
$(function () 
{   
    $('#txtStartDate, #txtEndDate').datepicker({
        showOn: "both",
        beforeShow: customRange,
        dateFormat: "dd M yy",
        firstDay: 1, 
        changeFirstDay: false
    });
});
function customRange(input) { 
    var min = new Date(2008, 11 - 1, 1), //Set this to your absolute minimum date
        dateMin = min,
        dateMax = null,
        dayRange = 6; // Set this to the range of days you want to restrict to
    if (input.id === "txtStartDate") {
        if ($("#txtEndDate").datepicker("getDate") != null) {
            dateMax = $("#txtEndDate").datepicker("getDate");
            dateMin = $("#txtEndDate").datepicker("getDate");
            dateMin.setDate(dateMin.getDate() - dayRange);
            if (dateMin < min) {
                dateMin = min;
            }
        }
        else {
            dateMax = new Date; //Set this to your absolute maximum date
        }                      
    }
    else if (input.id === "txtEndDate") {
        dateMax = new Date; //Set this to your absolute maximum date
        if ($("#txtStartDate").datepicker("getDate") != null) {
            dateMin = $("#txtStartDate").datepicker("getDate");
            var rangeMax = new Date(dateMin.getFullYear(), dateMin.getMonth(),dateMin.getDate() + dayRange);
            if(rangeMax < dateMax) {
                dateMax = rangeMax; 
            }
        }
    }
    return {
        minDate: dateMin, 
        maxDate: dateMax
    };     
}
好的,这个怎么样:
function customRange(input) 
{ 
    var min = new Date(2008, 12 - 1, 1);
    var dateMin = min;
    var dateMax = null;
    if (input.id == "txtStartDate" && $("#txtEndDate").datepicker("getDate") != null)
    {
        dateMax = $("#txtEndDate").datepicker("getDate");
        dateMin = $("#txtEndDate").datepicker("getDate");
        dateMin.setDate(dateMin.getDate() - 7);
        if (dateMin < min)
        {
            dateMin = min;
        }           
    }
    else if (input.id == "txtEndDate")
    {
        dateMax = new Date();
        if ($("#txtStartDate").datepicker("getDate") != null)
        {
            dateMin = $("#txtStartDate").datepicker("getDate");
            dateMax = $("#txtStartDate").datepicker("getDate");
            dateMax.setDate(dateMax.getDate() + 7); 
        }
    }
    return {
     minDate: dateMin, 
     maxDate: dateMax
   }; 
}
这是我能想到的最好的,满足你所有的要求(我认为...)
我意识到我对派对有点晚了,但这里是我如何修改工作示例代码。 我不需要设置特定的最大和最小日期,只是不希望日期范围重叠,所以我只是让他们设置对方:
jQuery(function() {
  jQuery('#calendardatetime_required_to, #calendardatetime_required_from').datepicker('option', {
    beforeShow: customRange
  });
});
function customRange(input) {
  if (input.id == 'calendardatetime_required_to') {
    return {
      minDate: jQuery('#calendardatetime_required_from').datepicker("getDate")
    };
  } else if (input.id == 'calendardatetime_required_from') {
    return {
      maxDate: jQuery('#calendardatetime_required_to').datepicker("getDate")
    };
  }
}
(我的日期选择器已经在脚本中被初始化了,但它只是默认设置。)
似乎做我需要它:)
看到我的例子。
链接地址: http://www.djcxy.com/p/68481.html