我有两个DatePickers
,它允许用户定义两个日期之间的间隔。我想知道如何检查这些之间的日期间隔
是否最多为 30 天。如果没有,则会弹出一条提及此问题的警报,并且不会发送请求。
我有一个div
:
<div id="excelExportDiv" class="glyphicon glyphicon-list-alt date_glyphicon top-4" data-url="@Url.Action("CreateExcelFile","Customer", new {id = Model.Konstants.First().STATION, xx="4", start = "", end = "", includeInactiveInExport = "" })"></div>
关联的javascript更新发送的参数。
$(function excelFunction() {
$('#excelExportDiv').click(function() {
var start = $('#startDateTextBox').val();
var end = $('#endDateTextBox').val();
var checkedValue = "off";
var inputElements = document.getElementsByClassName('messageCheckbox');
for (var i = 0; inputElements[i]; ++i) {
if (inputElements[i].checked) {
checkedValue = "on";
break;
}
}
var url = $(this).data("url") + "&start=" + start + "&end=" + end + "&includeInactiveInExport=" + checkedValue;
window.location.href = url;
});
});
检查date-interval
的逻辑已经写好了,所以基本上我有一个if
语句如下:
if (diffDays > 30) {
alert("Maximum range is 30 days!");
return false;
} else {
//submit the action...
}
如果 if
语句为 true,我希望发送表单。有什么想法吗?
最佳答案
您需要将这些日期解析为 Date目的。例如:
new Date(end)
和new Date(start)
。减去它的值。结果是毫秒级的差异:
(新日期(结束)- 新日期(开始))
最后,使用以下命令将其转换为日期:
(valueInMilliseconds)/1000/60/60/24
。例如:diffDays = (新日期(结束) - 新日期(开始))/1000/60/60/24;
类似这样的事情:
$(function() {
$("#startDateTextBox, #endDateTextBox").datepicker();
$("#excelExportDiv").on("click", function() {
var start = $("#startDateTextBox").val(),
end = $("#endDateTextBox").val(),
diffDays;
diffDays = (new Date(end) - new Date(start)) / 1000 / 60 / 60 / 24;
console.log(diffDays);
if (diffDays > 30) {
alert("Maximum range is 30 days!");
return false;
} else {
//submit the action...
}
});
});
div {
margin: 2px;
}
label {
display: block;
}
#excelExportDiv {
background-color: #ccc;
border: solid 1px #7e8da2;
border-radius: 5px;
color: inherit;
cursor: pointer;
display: inline-block;
padding: 10px;
}
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" />
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<div>
<label>Start date</label>
<input type="text" id="startDateTextBox">
</div>
<div>
<label>End date</label>
<input type="text" id="endDateTextBox">
</div>
<div id="excelExportDiv" class="glyphicon glyphicon-list-alt date_glyphicon top-4">Export</div>
希望这有帮助。
关于javascript - 提交前检查日期间隔,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47514652/