[英]Date range validation with jQuery UI datepicker: order of events
[英]jquery Datepicker date range validation
我有一个出生日期之类的字段。 我已经使用jquery datepicker显示日历,以便用户可以选择日期。现在我遇到了问题。
在“出生日期”字段中,有一个选项供您选择,在其中打开两个日期选择器字段,例如
出生日期-之间------- ---从-------和-至----------
现在的问题是,如果用户在“到字段”中选择一个小于“从字段”的日期,然后按提交按钮,它将被提交。 我需要阻止它提交并显示适当的消息,以便用户输入正确的日期。
请帮忙。
这是我正在使用的代码
<input id="borndate" class="dateISO" onchange="checkDate('borndate');">
</input>
<span id="span_borndate" style="display:none">
<input id="borndate" class="dateISO" onchange="checkDate('borndate');">
</span>
这是我正在使用的Java脚本
function checkdate(fieldname) {
var comparator = '#comp_' + fieldName;
var compVal = $(comparator).val();
Value = $('#' + fieldName).val();
var fromDate = jQuery.datepicker.parseDate('mm-dd-yy', Value, null);
Values = $('#' + fieldName + '-to').val();
var toDate = jQuery.datepicker.parseDate('mm-dd-yy', Values, null);
$('#span_' + fieldName).find('.error').remove();
if (compVal == "Between") {
if (toDate < fromDate) {
$('#span_' + fieldName).append("<label class='rangeError' generated='false'>Start date should come before end date</label>");
return false;
}
}
return true;
}
这是提交时再次调用的函数
function validateforms() {
var valid = true;
$('//classnamefor table rows which includes the date td').each(function (index) {
fieldName = $(this).attr("name");
if ($('#' + fieldName).hasClass('dateISO')) {
valid = checkDate(fieldName);
}
}
return valid;
}
尝试这个
http://jqueryui.com/demos/datepicker/#date-range
并使文本框为readonly ='true'
<input type="text" id="from" name="from_date" value="" readonly="true"/>
<input type="text" id="to" name="to_date" value="" readonly="true"/>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.