проверить форму перед отправкой (более сложной, чем проверка пустых полей)

У меня есть форма, содержащая входные данные для времени (в частности, время открытия и закрытия). когда нажата кнопка отправки, она переходит на страницу php, где эти входы добавляются в базу данных. Я хочу проверить несколько вещей, прежде чем разрешать отправку формы. например, я хочу убедиться, что время начала раньше (меньше) времени окончания. вот форма:

Opens: <select name="starthour1"> <option value="00">12</option> <option value="01">1</option> <option value="02">2</option> <option value="03">3</option> <option value="04">4</option> <option value="05">5</option> <option value="06">6</option> <option value="07">7</option> <option value="08">8</option> <option value="09">9</option> <option value="10">10</option> <option value="11">11</option> </select> : <select name="startminute1"> <option value="00">00</option> <option value="15">15</option> <option value="30">30</option> <option value="45">45</option> <option value="59">59</option> </select> <select name="startwhen1"> <option value="am">am</option> <option value="pm">pm</option> </select> Closes: <select name="endhour1"> <option value="00">12</option> <option value="01">1</option> <option value="02">2</option> <option value="03">3</option> <option value="04">4</option> <option value="05">5</option> <option value="06">6</option> <option value="07">7</option> <option value="08">8</option> <option value="09">9</option> <option value="10">10</option> <option value="11">11</option> </select> : <select name="endminute1"> <option value="00">00</option> <option value="15">15</option> <option value="30">30</option> <option value="45">45</option> <option value="59">59</option> </select> <select name="endwhen1"> <option value="am">am</option> <option value="pm">pm</option> </select> 

Я нашел код javascript для того, чтобы проверить отдельные элементы формы, но я не могу понять, как я мог бы комбинировать несколько без отправки. на моей php-странице у меня есть следующий код:

 $starthour1=$_POST['starthour1']; $startminute1=$_POST['startminute1']; $startwhen1=$_POST['startwhen1']; $endhour1=$_POST['endhour1']; $endminute1=$_POST['endminute1']; $endwhen1=$_POST['endwhen1']; $start_time1=$end_time1=""; if($startwhen1=="pm"){ $starthour1=$starthour1+12; } if($endwhen1=="pm"){ $endhour1=$endhour1+12; } $start_time1=$starthour1.":".$startminute1.":00"; $end_time1=$endhour1.":".$endminute1.":00"; if($end_time1=="00:00:00"){ $end_time1="23:59:00"; } echo "<br>start time is ".$start_time1; echo "<br>end time is ".$end_time1; $startnum=str_replace(":", "", $start_time1); $endnum=str_replace(":", "", $end_time1); if($endnum<$startnum){ echo "<br>start time can't be later than end time!"; } else{ //add to database } 

однако проверка этого материала после отправки не имеет смысла. я полагаю, что если бы ошибка была найдена, я мог бы перенаправить на исходную страницу, но это не кажется эффективным.

Кроме того, я думал, может быть, у меня может быть php на странице с формой, которая проверяет правильность. если он проверяет, он затем отправляет на страницу php, которая вставляет материал в базу данных. это имеет смысл и возможно ли это?

Есть ли лучшее решение? Я думаю, что есть что-то, что я мог бы сделать с javascript, но я не смог понять это.

Кроме того, я хотел бы сообщить пользователю о недопустимых вводах с текстом, который появляется рядом с полем ввода. я должен уметь это понять, как только все работает.

Благодарю.

Попросите onSubmit () или действие формы вызвать функцию JavaScript, например:

 <form id="form" onSubmit="return doSubmit();" action="#"> 

Затем в doSubmit () вы можете фактически выполнить любую из проверок (и только на самом деле отправить форму, если они пройдут)

 function doSubmit(){ if (validationsPass()) { $('#form').submit(); } } 

Чтобы информировать пользователей о недопустимом вводе рядом с фактическим полем формы, вы можете иметь скрытые div или интервалы рядом с каждым полем и использовать Javascript для их скрытия, если они не выполняют некоторую проверку.

 if(!fieldNotValid){ $('#field-error').show(); //Or use effects like .highlight() } 

Всегда проверяйте на уровне PHP пользовательский ввод, независимо от того, проверяете ли вы его на стороне клиента, используя javascript.

В javaScript я рекомендую вам использовать Js-библиотеку, такую ​​как jQuery, которая имеет плагин для проверки формы. Очень полезно и легко реализовать.

На уровне PHP я рекомендую использовать функции filter_var . Очень эффективен.

Вместо этого рассмотрите возможность преобразования данных формы в объекты DateTime . Это значительно упростит сравнение, в то время как каждая часть будет индивидуально работать. Он также гарантирует, что строка DateTime, помещенная в базу данных, безопасна для вставки, потому что вы получите строку из метода format () .

Спасибо за помощь! Я закончил тем, что использовал:

 <form action="add.php" onsubmit="return validate_form()" method="POST" name="addform"> 

с:

 function validate_form(){ var f = document.addform; var start, end, starthour, endhour; var valid=true; .......... starthour=f.starthour1.value; endhour=f.endhour1.value; if(f.startwhen1.value=="pm"){ var starthournum = starthour * 1; starthournum = starthournum+12; starthour = starthournum.toString(); } if(f.endwhen1.value=="pm"){ var endhournum = endhour * 1; starthournum = starthournum+12; starthour = starthournum.toString(); } start = starthour+f.startminute1.value; end = endhour+f.endminute1.value; if(end=="0000"){ end="2359"; } if(end<start){ alert("Start time can't be later than end time!"); valid=false; } return valid; }