如何防止选择日期范围？ [英] How to prevent selecting date range in which there is a disabled date in between?

问题描述

我有两个Jquery日期选择器，其中可以选择一系列日期。

我已经实现了某些限制，如textbox2的日期应该总是更大比textbox1。另外，我已经禁用某些日期。

我需要的是，如果用户从日期中选择，然后选择日期，如果之间存在禁用日期，那么用户不应该能够选择该范围。

例如：

我已禁用日期：31-5- 2014，1-6-2014，2-6-2014

如果用户选择date1为 5-2014 ，并尝试选择 4-6-2014 作为第二个日期，那么当禁用日期在betwebb中时，他不应该这样做。 date2的最大值必须为 30-5-2014

添加 小提琴

解决方案

函数validateDateRange到你的代码来说明完成这个任务所需的逻辑。请注意，我添加的功能的意图是简单地弹出警报，如果您描述的情况发生。从这里你应该可以做任何你喜欢的事情。如果您有更多问题或正在寻找其他内容，请告诉我们。

这是我的更新

  function validateDateRange（）{
 
 var txtStartDate = $（＃start_date）; 
 var txtEndDate = $（＃end_date）; 
 var startDate; 
 var endDate; 
 var tempDate; 
 
 if（txtStartDate.val（）==）
 return false; 
 
 if（txtEndDate.val（）==）
 return false; 
 
 startDate = new Date（txtStartDate.val（））; 
 endDate = new Date（txtEndDate.val（））; （i = 0; i< unavailableDates.length; i ++）
 
 {
 var temp = unavailableDates [i] .split（ - ）; 
 
 tempDate = new Date（temp [2]，temp [1] -1，temp [0]）; 
 
 if（startDate< tempDate&& endDate> tempDate）{
 alert（Invalid Date Range）; 
返回false; 
} 
} 
} 
  

I have two Jquery date pickers, in which a range of dates can be selected.

I have implemented certain restrictions like, the date of textbox2 should be always greater than textbox1. In addition I have disabled certain dates.

What I need is, if a user selects from date, and then selects to date, if there exist a disabled date in between, then the user should not be able to select that range.

For example:

I have disabled the dates: "31-5-2014", "1-6-2014", "2-6-2014"

If user selects date1 as 29-5-2014, and tries to select 4-6-2014 as the second date, then he should not be able to do that as disabled dates are in betweeb. The max value for date2 must be 30-5-2014

Adding the fiddle

解决方案

I added a function "validateDateRange" to your code to illustrate the logic required to complete this task. Please note that the intention of the function I added is to simply pop up an alert if the condition you described occurs. From here you should be able to do whatever you like. Let us know if you have more questions or were looking for something else.

Here are my updates

function validateDateRange() {

    var txtStartDate = $("#start_date");
    var txtEndDate = $("#end_date");
    var startDate;
    var endDate;
    var tempDate;

    if (txtStartDate.val() == "") 
        return false;

    if (txtEndDate.val() == "") 
        return false;

    startDate = new Date(txtStartDate.val());
    endDate = new Date(txtEndDate.val());

    for (i = 0; i < unavailableDates.length; i++) {
        var temp = unavailableDates[i].split("-");

        tempDate = new Date(temp[2], temp[1]-1, temp[0]);

        if (startDate < tempDate && endDate > tempDate) {
            alert("Invalid Date Range");
            return false;
        }
    }
}

这篇关于如何防止选择日期范围？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！