2015-01-13 9 views
1

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

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

«Произошла ошибка»

У меня есть три разных divs, div1 div2 и div3, которые содержат утверждения ошибок. Я сделал это, потому что я разделил свою форму на три раздела. Поэтому я хочу, чтобы мой javascript выполнял три разные проверки в трех разных разделах в моей форме, и если произошла ошибка, в которой когда-либо была секция, тогда отобразите div1 или div 2 или div3 для этого раздела.

Section 1 
<div 1> 
<input = firstname> 
<input = lastname> 
<input = email> 
<input = email2> 

section 2 
<div 2> 
<input = contactnum> 
<input = mobnum> 
<input = postcode> 

section 3 
<div 3> 
<input = compname> 
<input = compreg> 

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

<script> 
    function validateForm() { 
     var a = document.forms["register"]["firstname"].value; 
     var b = document.forms["register"]["lastname"].value; 
     var c = document.forms["register"]["email"].value; 
     var d = document.forms["register"]["email2"].value; 
     if (a == null || a == "" || b == null || b == "" || c == null || c == ""|| d == null || d == "") { 
      $(".form_error").show(); 
      $('html,body').animate({ 
       scrollTop: $(".form_error").offset().top - 180 
      }); 


      var e = document.forms["register"]["contactnum"].value; 
      var f = document.forms["register"]["mobnum"].value; 
      var g = document.forms["register"]["postcode"].value; 
      if (e == null || e == "" || f == null || f == "" || g == null || g == "") { 
       $(".form_error").show(); 
       $('html,body').animate({ 
        scrollTop: $(".form_error").offset().top - 180 
       }); 


       var h = document.forms["register"]["compname"].value; 
       var i = document.forms["register"]["compreg"].value; 
       if (h == null || h == "" || i == null || i == "") { 
        $(".form_error").show(); 
        $('html,body').animate({ 
         scrollTop: $(".form_error").offset().top - 180 
        }); 

        return false; 
       } 
      } 
     } 

</script> 
+0

Возможные Дубликат: [HTML/Javascript: Простая форма проверки на Submit] (http://stackoverflow.com/questions/16134733/html-javascript-simple-form-validation-on- submit) Но чтобы попытаться помочь, убедитесь, что вы действительно выполняете код проверки с использованием атрибута 'onSubmit' HTML в самом теге'

'. –

+0

вы можете вызвать этот метод в форме события onsubmit и выполнить e.preventDefault() и после этого подтвердить код, а затем document.form.submit(); или документа. .submit(); – Innovation

+0

@Innovation Спасибо, но я пробовал это, и он не имеет никакого значения, форма все еще отправляет –

ответ

3

Вы должны использовать event.preventDefault(); в инструкции if, когда вы проверяете наличие ошибок.

Я нажимаю кнопку отправки, сначала проверяю все поля, если что-то не в порядке, поднимите event.preventDefault(). При этом это предотвратит отправку формы.

Если ошибок нет, то preventDefault не будет поднят, и форма будет отправлена.

Дополнительная информация: jQuery API

+0

спасибо, что я попытался добавить это, но все же не помешал отправке формы –

6

В виде тега есть поле onsubmit указать вашу функцию проверки. Нечто подобное:

<form name="myForm" onsubmit="return validateForm()" method="post"> 
    <!-- your inputs --> 

</form> 
Смежные вопросы