Валидация input внутри div, а не внутри form
На сайте есть форма регистрации пользователей.
<div class="page_register clearfix"> <div class="w1200"> <div class="r_icon1"></div> <div class="r_icon2"></div> <div class="r_icon3"></div> <div class="r_icon4"></div> <div class="r_icon5"></div> <form method="post" id="post_form" action=""> <div class="register_form"> <div class="mt">account_registratio</div> <div class="item clearfix"> <div class="label">login_register_username</div> <div class="item-text"> <input type="text" id="member_name" name="member_name" class="text" tabindex="1" placeholder=login_register_username_to_login/> </div> </div> <div class="item clearfix"> <div class="label"> login_register_pwd </div> <div class="item-text"> <input type="password" id="member_password" name="member_password" class="text" tabindex="1" placeholder=""/> </div> </div> <div class="item clearfix"> <div class="label"> login_register_ensure_password </div> <div class="item-text"> <input type="password" id="member_password_confirm" name="member_password_confirm" class="text" tabindex="1" placeholder=""/> </div> </div> <div class="item"> <input type="submit" class="btn login-btn" value=login_register_login_now_4 /> </div> </div> </form> </div> </div> <script> $(function () { $("#post_form").validate({ errorPlacement: function (error, element) { var error_td = element.parent('.item-text'); error_td.append(error); element.parents('.item:first').addClass('error'); }, success: function (label) { label.parents('.item:first').removeClass('error').find('label').remove(); }, rules: { member_name: { required: true, minlength: 3, maxlength: 15, remote: { url: HOMESITEURL + '/Login/check_member.html', type: 'get', data: { user_name: function () { return $('#member_name').val(); } } } }, member_password: { required: true, minlength: 6, maxlength: 20 }, member_password_confirm: { required: true, equalTo: '#member_password' }, }, messages: { member_name: { required: '<i class="iconfont"></i>login_register_input_username', minlength: '<i class="iconfont"></i>login_register_username_range', maxlength: '<i class="iconfont"></i>login_register_username_range', remote: '<i class="iconfont"></i>login_register_username_exists' }, member_password: { required: '<i class="iconfont"></i>login_register_input_password', minlength: '<i class="iconfont"></i>login_register_password_range', maxlength: '<i class="iconfont"></i>login_register_password_range' }, member_password_confirm: { required: '<i class="iconfont"></i>login_register_input_password_again', equalTo: '<i class="iconfont"></i>login_register_password_not_same' }, } }); }); </script> Для валидации формы, в хедере размещен плагин <script src="/jquery.validate.min.js?1"></script>https://jqueryvalidation.org/ Я хочу поменять в форме тег form c id="post_form" на тег div, чтобы на странице регистрации не было формы и тем самым скрыть форму регистрации от ботов. Далее я добавил скрипт который формирует скрытую форму с тегом form и при нажатии кнопки отправляет регистрацию. С этим всё получилось. В выше указанной форме этого кода нет, чтобы не нагромождать сейчас. После замены form на div, валидатор конечно перестал работать. Вопрос: Как проверять псевдоформу с тегом div имеющим id="post_form" все input находящиеся внутри div? |
Цитата:
А плагин работает с формой, ее полями, методами, которых у div нет. |
Цитата:
Какой плагин будет работать? Кто может сделать, чтобы работало как я описал выше? |
Цитата:
<input type="text" id="member_name" name="be5695717fb290b0234f1ea7d1b5386e[1]" class="text" tabindex="1" placeholder=""/> <input type="password" id="member_password" name="be5695717fb290b0234f1ea7d1b5386e[2]" class="text" tabindex="1" placeholder=""/> .... не помещать явных сладостей (login_register_username_to_login) в их атрибуты, а формировать их в объекте и скриптом добавлять, а тип поля "password" эмулировать типом "text", то уже это добавит неудобства боту. Чем больше программного в построении формы и случайного от сессии к сессии тем сложнее, каждый раз придется анализировать воочию скрипт, чтобы натравить потом на него собаку. А что такое be5695717fb290b0234f1ea7d1b5386e[1], be5695717fb290b0234f1ea7d1b5386e[2], знает сервер, храня ключ be5695717fb290b0234f1ea7d1b5386e в сессии. Если будет прислан иной, значит левый запрос, так как либо ключа вообще нет в сессии, либо иной. По ключам [1], [2] как по индексам массива на сервере описывающем реальные имена полей можно их получить. |
Ваш вариант хорош, но у меня есть уже готовое решение, которое хорошо работает уже несколько лет на другом сайте.
Моя задача адаптировать имеющееся решение на новом сайте, где прикручен валидатор, который проверяет логин нового пользователя - зарегистрирован пользователь с таким логином или нет, ну и другие поля. Я уверен, что мою задачу сделает специалист. Ок, вот такую скрытую форму создает скрипт, после нажания кнопки Отправить (login_register_login_now_4): <form id="form" method="POST" name="post_form" action=""> <input type="hidden" id="member_name" name="member_name" class="text" tabindex="1" style="display: none;"> <input type="hidden" id="member_password" name="member_password" maxlength="11" class="text" tabindex="1" style="display: none;"> <input type="hidden" id="member_password_confirm" name="member_password_confirm" class="text" tabindex="1" style="display: none;"> </form> Далее я добавил скрипт, которые проверяет input у скрытой формы: function submitbutton() { let form = document.post_form, r = new RegExp("[^0-9A-Za-z]", "i"); e = /^([a-z0-9_\.-])+@[a-z0-9-]+\.([a-z]{2,4}\.)?[a-z]{2,4}$/i; // do field validation if (form.member_name.value == "") { alert( "Пожалуйста, введите Ваш логин." ); } else if (r.exec(form.member_name.value)) { alert( "Пожалуйста, введите правильно Логин. Не должно быть пробелов, только символы 0-9,a-z,A-Z и длина больше 6 символов" ); } else if (form.member_password.value == "") { alert( "Пожалуйста, введите пароль." ); } else if (form.member_password_confirm.value == "") { alert( "Пожалуйста, введите пароль повторно." ); } else { form.submit(); } } Как мне теперь, в этот скрипт, добавить проверку логина нового пользователя? url: HOMESITEURL + '/Login/check_member.html', В первом посте есть полностью этот код. |
Цитата:
|
Часовой пояс GMT +3, время: 08:14. |