2015-02-01 5 views
0

У меня есть javascript, который пытается проверить форму, точнее часть формы «type = date» формы. Но по какой-то причине, когда я отправить форму, она даже не запускать скрипт (я думаю?) И просто идет на страницу, указанную вПроверка Javascript не выполняется при отправке формы

здесь код

<!-- script to make sure only weekdays are selected --> 
<script> 
var date = document.querySelector('[type=date]'); 

function noWeekends(e){ 

    var day = new Date(e.target.value).getUTCDay(); 

    // Days in JS range from 0-6 where 0 is Sunday and 6 is Saturday 

    if(day == 0 || day == 6){ 
     e.target.setCustomValidity('Please select a weekday.'); 
     return false; 
    } else { 
     e.target.setCustomValidity(''); 
    } 
} 
date.addEventListener('input',noWeekends); 
</script> 
<!--============================================================ 
=======================form starts here=========================--> 

<form action="confirm_booking.php" onsubmit="noWeekends()" method='post'> 
<?php 
echo "Room: "; 
select_room(); 
?> 
week starting: <input type=date name='WeekStart'/> 

<input type="submit" value="Book Room"> 
</form> 
+0

Также я не уверен, если это имеет значение, но в теге

я помещал «NoWeekends()» вместо onsubmit вместо «NoWeekends (e)». Ни один из них не работал –

+0

Ничто не мешает отправке формы, возврат false в функции слишком поздний – adeneo

+0

Угадайте, что вам не нужно (и не хотите) запускать проверку на отправке, но раньше. И IMHO date.addEventListener («вход», noWeekends); не может работать, как насчет date.addEventListener ('keyup', noWeekends); ? – ddlab

ответ

0
<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="utf-8" /> 
    <title></title> 
    </head> 
    <body> 
     <form id="form" action="confirm_booking.php" method='post'> 
     <?php 
     echo "Room: "; 
     select_room(); 
     ?> 
     week starting: <input id="date" type=date name='WeekStart'/> 
     </form> 
     <input type="submit" value="Book Room" onclick="noWeekends()"> 
     <script> 
     function noWeekends(){ 
      var date = document.getElementById('date'); 
      var day = new Date(date.value).getUTCDay(); 
      console.log(day); 
      if(day == 0 || day == 6){ 
       date.setCustomValidity('Please select a weekday.'); 
       return false; 
      } else { 
       date.setCustomValidity(''); 
       document.getElementById("form").submit(); 
      } 
     } 
     </script> 
    </body> 
</html> 

работает как Ожидаемый

Примечание: кнопка отправки является ВНЕШНИМ формой, и при нажатии скрипт выполняется и представляет форму программно, если все правильно.

Смежные вопросы