是什么阻止我的表格被淘汰?

时间:2018-05-01 18:41:53

标签: javascript jquery validation

我已经制作了一个表单,我正在使用jquery在客户端验证它。验证工作正常,但经过验证后,表单未提交。有人可以告诉我这里有什么问题吗?

模糊事件工作正常..但未提交表单。 表单的action属性指向laravel函数。

形式: -

  <form id="demo_form2" method="post" action="{{url('admin/manage/save_admin')}}" enctype="multipart/form-data">
<input type="text" id="name" required="required" name="name"><span id="namerror">
<input type="text" id="email" name="email" required="required" ><span id="emailerror">
 <input type="password" id="password" name="password" required="required"><span id="passerror">
<input name="myfile"  type="file" id="file1" accept="image/*"><span id="imgerror">
</form>

<script type="text/javascript">
  $(document).ready(function(){
   var nm=$('#name').val();
      var em=$('#email').val();
      var ps=$('#password').val();
      var img=$('#file1').val();
       var nmreg=/^[A-Za-z ]{3,20}$/i;
       var emreg=/^\b[A-Z0-9._%-]+@[A-Z0-9.-]+\.[A-Z]{2,4}\b$/i;
       var psreg=/^[a-z0-9A-Z!@#$%^&*() <>{}()?/":']{6,30}$/i;
    $('#demo_form2').submit(function(e){
      e.preventDefault();


       if(nmreg.test(nm)==false || nm.trim()=='' || nm==''){return false;}
else{return true;}
      if(emreg.test(em)==false || em.trim()=='' || em==''){return false;}
else{return true;}
      if(psreg.test(ps)==false || ps.trim()=='' || ps==''){return false;}
else{return true;}
      if(img=='' || img.trim()==''){return false;}
else{return true;}

    });

    $('#name').on('blur',function(){
       if(nmreg.test(nm)==false || nm.trim()=='' || nm=='')
       {
            $('#nameerror').html("Please Enter Valid Name");
          return false;
       }
       else
       {
          $('#nameerror').html("");
          return true;
       }
    });


    $('#email').on('blur',function(){
      if(emreg.test(em)==false || em.trim()=='' || em==''){  $('#emailerror').html("Please Enter Valid Email");
        return false;}
      else{  $('#emailerror').html("");
         return true;
      }
    });


    $('#password').on('blur',function(){
      if(psreg.test(ps)==false || ps.trim()=='' || ps=='')
      {
        $('#passerror').html("Enter Valid Password(6-30 characters)");
        return false;
      }
      else { $('#passerror').html("");
        return true; }
    });

    $('#file1').on('blur',function(){
   if(img==''){        $('#imgerror').html("Select an Image"); }
      else{   $('#imgerror').html("");
        return true; }
    });
  });
</script>

1 个答案:

答案 0 :(得分:0)

您的表单的submit事件处理程序调用{​​{1}}作为它的第一件事,因此其他任何代码都不会产生任何影响。您已取消该表单的提交活动。

删除该行,并在您知道表单无效时使用它。

不要使用e.preventDefault();return true乱丢您的代码,而是假设表单有效,并且只有当您的验证测试证明它不是时,请取消return false事件。 submit参数会自动传递给您的回调,例如event

另外(FYI),e.preventDefault()方法用于设置/获取包含HTML的字符串。如果您不使用HTML字符串,请改用.html()。它更快,更安全。