Нужна помощь с Ajax и Jquery
Всем привет, плохо у меня с Jquery, в основном на php пишу.
Помогите пожалуйста сделать валидацию полей в форме чтобы проверки были на каждое поле в форме на пустоту перед отправкой. HTML: div id="fieldone"> <div class="reg-form-block"> <div class="reg-form"> <div class="title">Имя</div> <input id="fio" name="fio" value="" type="text" placeholder="Фамилия Имя Отчество"> </div> <div class="reg-form"> <div class="title">Логин</div> <input id="login" name="login" value="" type="text" placeholder="Ваш логин"> </div> <div class="reg-form"> <div class="title">E-mail</div> <input id="email" name="email" value="" type="text" placeholder="Введите e-mail"> </div> <div class="reg-form"> <div class="title">Пароль</div> <input id="pass" name="pass" value="" type="password" placeholder="Введите пароль"> </div> <div class="reg-form"> <div class="title">Повторите пароль</div> <input id="re_pas" name="re_pas" value="" type="password" placeholder="Введите пароль"> </div> </div> </div> Jquery: $(document).ready(function () { // после загрузки DOM $("#ajax_user").submit(function () { // this указывает на нашу форму var str = $(this).serialize(); // сериализуем данные для POST-запроса $.ajax( { type: "POST", url: "regform_user.php", data: str, success: function (msg) { $(document).ajaxComplete(function (event, request, settings) { //if (msg == 'OK') // Если сообщение отправлено, поблагодарим пользователя //{ //result = 'Ваше сообщение отправлено. Спасибо!'; //$("#fieldone").css('display','none'); //} //else //{ //result = msg; //} //$("#noteone").html(result); }); } }); return false; }); }); Понимаю что должно быть типа if($("fio").val()){ } else { form.send } Но не понимаю куда вставлять и как сделать в 1 функции сразу проверки на все поля. Кстати если что аякс возвращает массив ошибок, если они есть, лучше бы их реализовать, но не знаю как работать с массивами Jquery и как правильно разбить принятый из php массив. |
Цитата:
<!DOCTYPE html> <html> <head> <meta http-equiv='Content-Type' content='text/html; charset=windows-1251' /> <script src='https://code.jquery.com/jquery-latest.js'></script> <!-- <script src="https://code.angularjs.org/1.3.9/angular.min.js"></script> <script src="https://code.angularjs.org/1.3.9/angular-route.js"></script> --> <style type='text/css'> </style> <script type='text/javascript'> $(function(){ $('form').submit(function(){ var n=$(this).find('input').filter(function(){ return (this.value=='')? true: false; }).length; if (n>0) { alert('Не заполнено '+n+'шт. полей'); return false; }; return true; }); }); </script> </head> <body> <form> <div class="reg-form-block"> <div class="reg-form"> <div class="title">Имя</div> <input id="fio" name="fio" value="" type="text" placeholder="Фамилия Имя Отчество"> </div> <div class="reg-form"> <div class="title">Логин</div> <input id="login" name="login" value="" type="text" placeholder="Ваш логин"> </div> <div class="reg-form"> <div class="title">E-mail</div> <input id="email" name="email" value="" type="text" placeholder="Введите e-mail"> </div> <div class="reg-form"> <div class="title">Пароль</div> <input id="pass" name="pass" value="" type="password" placeholder="Введите пароль"> </div> <div class="reg-form"> <div class="title">Повторите пароль</div> <input id="re_pas" name="re_pas" value="" type="password" placeholder="Введите пароль"> </div> </div> </div> <button>Отправить</button> </form> </body> </html> |
Цитата:
|
Цитата:
|
Цитата:
|
Цитата:
|
Цитата:
|
Цитата:
|
$(document).ready(function() { // после загрузки DOM $("#ajax_user").submit(function() { // © ksa, [url]https://javascript.ru/forum/misc/71907-nuzhna-pomoshh-s-ajax-i-jquery.html#post473419[/url] var n = $(this).find('input').filter(function() { return (this.value == ''); }).length; if (n > 0) { alert('Не заполнено ' + n + 'шт. полей'); return false; }; // this указывает на нашу форму var str = $(this).serialize(); // сериализуем данные для POST-запроса $.ajax({ type: "POST", url: "regform_user.php", data: str, success: function(msg) { $(document).ajaxComplete(function(event, request, settings) { //if (msg == 'OK') // Если сообщение отправлено, поблагодарим пользователя //{ //result = 'Ваше сообщение отправлено. Спасибо!'; //$("#fieldone").css('display','none'); //} //else //{ //result = msg; //} //$("#noteone").html(result); }); } }); return false; }); }); Заранее прошу прощения, но страшно представить, что вы на php способны написать, если даже с такой тривиальной задачей не справились. |
Спасибо)
|
Часовой пояс GMT +3, время: 11:26. |