Проверка заполнения полей формы
Добрый день! Имеется форма и простейший скрипт проверки:
<form onsubmit="return checkForm(this)" action="index.php" method="post">
<div id="contact-form">
<div>
<label for="fio" class="label">Ваше имя</label>
<input type="text" value="" name="fio" id="fio" class="w-460" />
<p id='err_fio' class='error'></p>
</div>
<div>
<label for="phone" class="label">Телефон</label>
<input type="text" value="" name="phone" id="phone" class="w-460" />
</div>
<input id="submit-form" type="submit" value="Оформить заказ" />
</div>
</form>
<script type="text/javascript">
function checkForm(form){
if (document.getElementById('fio').value=="") {
document.getElementById('err_fio').innerHTML='Введите имя';
return false;
};
return true;
};
</script>
При нажатии кнопки Submit происходит отправка формы без проверки заполнения поля "Ваше имя" с id="fio". Пример скрипта взят с форума. Облазила аналогичные темы, но причину по-прежнему не могу найти. Прошу помочь. |
Цитата:
|
Ок, допустим, что именно при таком раскладе не происходит (к сожалению, не могу уточнить информацию, так как редактирую действующий сайт в данный момент результаты заполнения формы отсылаются на чужой e-mail).
Тогда вопрос следующий: почему не подгружается нужная информация об ошибке в искомый div, а происходит перезагрузка страницы? |
kefalia,
всё подгружается - информация об ошибке в диве ищите неправильные теги, форма в форме, одинаковые id.
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body>
<form onsubmit="return checkForm(this)" action="index.php" method="post">
<div id="contact-form">
<div>
<label for="fio" class="label">Ваше имя</label>
<input type="text" value="" name="fio" id="fio" class="w-460" />
<p id='err_fio' class='error'></p>
</div>
<div>
<label for="phone" class="label">Телефон</label>
<input type="text" value="" name="phone" id="phone" class="w-460" />
</div>
<input id="submit-form" type="submit" value="Оформить заказ" />
</div>
</form>
<script type="text/javascript">
function checkForm(form){
if (document.getElementById('fio').value=="") {
document.getElementById('err_fio').innerHTML='Введите имя';
return false;
};
return true;
};
</script>
</body>
</html>
|
Пересохранила файл еще раз, все заработало. Спасибо!
|
Доброй ночи :)
Пичаль заключается вот еще в чем:
<form onsubmit="return checkForm(this)" action="index.php" method="post">
<div id="contact-form">
<div>
<label for="fio" class="label">Ваше имя</label>
<input type="text" value="" name="fio" id="fio" class="w-460" />
<div id='err_fio' class='error'></div>
</div>
<div>
<label for="phone" class="label">Телефон</label>
<input type="text" value="" name="phone" id="phone" class="w-460" />
<div id='err_phone' class='error'></div>
</div>
<div>
<label for="email" class="label">E-mail</label>
<input type="text" value="" name="email" id="email" placeholder="Введите, чтобы получить копию заказа" class="w-460" />
</div>
<div id='err_email' class='error' style="color: red;"></div>
<input id="submit-form" type="submit" value="Оформить заказ" />
</div>
</form>
<script type="text/javascript">
function checkForm(form){
if (document.getElementById('email').value==""){
document.getElementById('err_email').innerHTML='Заполните данные о заказчике';
return false;
}
else {
document.getElementById('err_email').innerHTML="";
};
if (document.getElementById('fio').value==""){
document.getElementById('err_fio').innerHTML='Заполните данные о заказчике';
return false;
}
else {
document.getElementById('err_fio').innerHTML="";
};
if (document.getElementById('phone').value==""){
document.getElementById('err_phone').innerHTML='Заполните данные о заказчике';
return false;
}
else {
document.getElementById('err_phone').innerHTML="";
};
return true;
};
</script>
Подозреваю, что я что-то намудрила с условиями. Значение value передается только из поля с id="email", из остальных полей не передается ничего, даже если они заполнены. Причем, если повесить на каждый input событие onblur="alert(this.value)", то во всплывающем окне появляется значение, введенное в поле, а в функцию - не передается. То есть, сначала проверяется email (так было сделано с целью эксперимента), затем проверяется имя и, даже если поле заполнено, при повторном нажатии на submit, остается надпись "Заполните данные о заказчике". |
kefalia,
может опять чего несохранили -- работает всё |
Проблема решилась путем изменения id полей (видимо дублировались id):)
|
kefalia,
неувидел этой ошибки |
Уже все исправила (см. предыдущее сообщение) :) спасибо! :)
|
| Часовой пояс GMT +3, время: 21:55. |