Я создал форму и проверяю ее на стороне клиента с помощью jquery. Валидации работают хорошо, но после валидации форма не отправляется. Может кто-нибудь сказать мне, что здесь не так?
События размытия работают нормально .. Но форма не отправлена. Атрибут действия формы указывает на функцию 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>
Обработчик событий submit
вашей формы в первую очередь вызывает: e.preventDefault();
, поэтому ни один другой код не окажет никакого влияния. Вы отменили событие отправки формы.
Удалите эту строку и используйте ее только в том случае, если вы знаете, что ваша форма недействительна.
Вместо того, чтобы засорять ваш код return true
и return false
, предположите, что форма действительна, и только когда вы проверяете, что это не так, отмените событие submit
с аргументом event
, который автоматически передается в ваш обратный вызов, как этот e.preventDefault()
.
Кроме того (к сведению), метод .html()
предназначен для установки / получения строк, содержащих HTML. Если вы не используете строки HTML, используйте вместо них .text()
. Это быстрее и безопаснее.