HTML日期选择器限制基于在第一日期字段中选择日期

Question

希望所有做的很好，我需要更多关于HTML5日期字段，一个小的帮助在第二日期字段日期，

我已经了3个HTML日期选择器名称batch start date，batch end date ，Assessment date如下。

Batch start date:- <input type="date" required name="batch_startdate" id="textfield7"/> 

Batch End date:- <input type="date" required name="batch_Enddate" id="textfield8"/> 

Assessment date:- <input type="date" name="Ass_Date" id="textfield9"/> 

我的要求是 - 用户可以不能够选择批次结束日期之前的日期，他在批次开始日期往里面评估基准日的日期比批次结束日期时，

例如：

： - 假设批次开始日期为： - 20-03-2017 比批次结束日期永远不低于20-03-2017，评估日期也不低于批次结束日期中选择的日期。

它可能在html5日期选择器？任何帮助将不胜感激，先谢谢您。

Answer 1

你可以用JavaScript做

document.getElementById('textfield7').onchange = function() { 
    document.getElementById('textfield8').setAttribute('min', this.value); 
    document.getElementById('textfield9').setAttribute('min', this.value); 
}; 

Demo Here

重要提示：总是在服务器端验证。客户端验证只能是危险的。

另请注意，您必须检查这两个字段中已经选择的日期是否有效。上面的代码不会检查它是否只是更改min属性。

编辑：下面的代码检查已经选择的日期是否有效。

document.getElementById('textfield7').onchange = function() { 
    var textfield8 = document.getElementById('textfield8'); 
    var textfield9 = document.getElementById('textfield9'); 
    textfield8.setAttribute('min', this.value); 
    textfield9.setAttribute('min', this.value); 
    if (textfield8.value !='' && textfield8.value < this.value){ 
     textfield8.value=this.value; 
    } 
    if (textfield9.value !='' && textfield9.value < this.value){ 
     textfield9.value=this.value; 
    } 
}; 

Demo Here