Пытаюсь сделать проверку двух полей, в первом поле дата не должна быть меньше 01.1960 а во втором поле не больше чем текущая дата, и если даты не правильные то нужна какая-то подсказка возле поля, а не как я пытаюсь сделать в alert помогите пожалуйста как это можно реализовать? Я понимаю что я сравниваю со строкой, но вот как туда именно дату указать, я не знаю.
Код:
function validate_form( )
{
valid = true;
if (document.formValid.inputDateFirst.value < "01.01.1960")
{
alert("Дата не меньше чем 01.1960");
valid = false;
}
return valid;
}
<div class="container-fluid" style="position: relative">
<h4>Оберіть діапазон дат</h4>
<form name ="formValid" class="form-inline" action="Xls" onsubmit="return validate_form( );">
<div class="form-group">
<label>Початкова дата</label>
<input type="text" name="inputDateFirst" class="inputDate form-control" id="inputDateFirst">
</div>
<div class="form-group">
<label>Кінцева дата</label>
<input type="text" name="inputDateSecond" class="inputDate form-control" id="inputDateSecond" >
</div>
<button class="btnCollor btn btn-md btn-success"
data-toggle="tooltip" data-placement="bottom" title="xls">
Жми</button>
</form>
</div>
Думаю изначально вы некорректно задали свой вопрос, если вы используете datapicker нет необходимости самому проверять какую дату выбрал пользователь, это может сделать сам datapicker. Вот примерный код работы двух инпутов для выбора промежутка даты:
function getCalendar(input1, input2) {
var dateToday = new Date();
$('#' + input1).datepicker({
showOn: "button",
autoSize: true,
showAnim: "slide",
dateFormat: "mm.dd.yy",
buttonImage: "/icon.png",
buttonImageOnly: true,
changeMonth: true,
minDate: new Date(01, 01, 1960),
onSelect: function (selectedDate) {
$('#' + input2).datepicker("option", "minDate", selectedDate);
}
});
$('#' + input2).datepicker({
showOn: "button",
autoSize: true,
showAnim: "slide",
dateFormat: "mm.dd.yy",
buttonImage: "/icon.png",
buttonImageOnly: true,
changeMonth: true,
maxDate: dateToday,
onSelect: function (selectedDate) {
$('#' + input1).datepicker("option", "maxDate", selectedDate);
}
});
}
Вызываете функкцию, передаёте ID ваших инпутов, и всё. Можно просто использовать параметр minDate и установить нужную дату. В моём примере так же происходит проверка как первого инпута, так и второго(в зависемости друг от друга)
Если не пугает HTML5 + проверка JS
<form>
<input type="date" name="myDate" min="1960-01-01">
<input type="date" name="myDate" max="2018-11-27">
<br/><input type=submit>
</form>
Апостиль в Лос-Анджелесе без лишних нервов и бумажной волокиты
Основные этапы разработки сайта для стоматологической клиники
Продвижение своими сайтами как стратегия роста и независимости