Перейти из форума на сайт.

НовостиФайловые архивы
ПоискАктивные темыТоп лист
ПравилаКто в on-line?
Вход Забыли пароль? Первый раз на этом сайте? Регистрация
Компьютерный форум Ru.Board » Интернет » Web-программирование » Валидация формы через element.getAttribute

Модерирует : Cheery

 Версия для печати • ПодписатьсяДобавить в закладки

Открыть новую тему     Написать ответ в эту тему

newbies



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Здравствуйте, сделал валидацию формы через. ( element.getAttribute ).
 
скрипт:

Код:
 
function checkForm(obj, elems) {  
 var element, pattern;  
 for (var i = 0; i < obj.elements.length; i++) {// пробегаемся по всем элементам формы  
 element = obj.elements[i];  
 // Проверяем только нужные поля  
 if (elems != undefined)  
 if (elems.join().indexOf(element.type) < 0) continue;  
 // И только если есть чего говорить юзеру в случае ошибки  
 if (!element.getAttribute("check_message")) continue;  
 if (pattern = element.getAttribute("check_pattern")) { // если задан рег  
 pattern = new RegExp(pattern, "g");  
 if (!pattern.test(element.value)) {  
 alert(element.getAttribute("check_message"));  
 element.focus();  
 return false;  
 }  
 } else if(/^\s*$/.test(element.value)) {// иначе просто проверка что поле не пустое  
 alert(element.getAttribute("check_message"));  
 element.focus();  
 return false;  
 }  
 }  
 return true;  
 }  
 </script>
 

 
На данный момент если срабатывает валидация, всплывает окно брайзера стандартное и пишет что такое то поле не заполнено.
 
Подскажите как реализовать вывод сообщения в div,  хочу убрать всплывающие окно. брайзер ругается бывает и просит поставить галочку на закрытие данного окна.
 
Так же как реализовать что бы к диву перекидывало после срабатывания валидации.

Всего записей: 2112 | Зарегистр. 23-06-2006 | Отправлено: 08:12 22-07-2015
Mavrikii

Platinum Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
newbies
JavaScript: Проверка значений элементов формы (e-mail, имя.. !!!!
 

Цитата:
Подскажите как реализовать вывод сообщения в div,  хочу убрать всплывающие окно

document.getElementById('div_id').innerHTML = ...
 

Цитата:
Так же как реализовать что бы к диву перекидывало после срабатывания валидации.

либо переадресация на тот же URL страницы с #div_id добавленным.
либо вычисляем положение элемента на странице и скроллируем окно к нему.

Всего записей: 15117 | Зарегистр. 20-09-2014 | Отправлено: 19:23 22-07-2015
newbies



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Цитата:
 
либо переадресация на тот же URL страницы с #div_id добавленным.  
либо вычисляем положение элемента на странице и скроллируем окно к нему.
 

 
а есть примеры данных вариантов, какой лучше варийнт?  
 
На данный момент в скрипте код который вызывает окно, выходит что кусок кода мне надо заменить на этот код ( document.getElementById('div_id').innerHTML = ... )
 
Подскажите пожалуйста, где в коде что на что заменить, заранее благодарен.

Всего записей: 2112 | Зарегистр. 23-06-2006 | Отправлено: 18:28 23-07-2015
Mavrikii

Platinum Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
newbies

Цитата:
На данный момент в скрипте код который вызывает окно, выходит что кусок кода мне надо заменить на этот код

для начала нужно определиться в какой div выводить собираетесь. какой у него id.
вот вместо alert(..) и вставляете  
document.getElementById('div_id').innerHTML = "текст сообщения"
 

Цитата:
а есть примеры данных вариантов, какой лучше варийнт?  

без понятия, скроллирование это визуальная вещь, код на нее не влияет.

Всего записей: 15117 | Зарегистр. 20-09-2014 | Отправлено: 19:07 23-07-2015
newbies



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Да в любой, какой придумаем в тот и будем, для примера, validationka.
Скролирование, это когда кнопку боттон оборачиваю в <a> </a> этот метод? и там через js. по клику перекидывает к id валидации.

Всего записей: 2112 | Зарегистр. 23-06-2006 | Отправлено: 07:15 24-07-2015
Mavrikii

Platinum Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
newbies

Цитата:
 и там через js. по клику перекидывает к id валидации.

либо кликом (или его имитацией с помощью js), либо с помощью
http://www.w3schools.com/jsref/met_win_scrollto.asp

Всего записей: 15117 | Зарегистр. 20-09-2014 | Отправлено: 07:18 24-07-2015
newbies



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
заменил это:
alert(element.getAttribute("check_message"));    
 
на это:
document.getElementById('validationka').innerHTML = "check_message"
 
ниже идет это:
element.focus();
return false;    
}    
 
вывел вывод валидации
<div id="validationka"></div>
 
А во все, там два алерта их надо было заменить, я заменил, выводит в див этом, но выводит он надпись ! ( "check_message" ).
а как вывести тот текст, что он выводил в окне всплывающем.
 
<input type="text" name="prname" min="10" maxlength="80" id="textarea" autofocus check_message="Введите заголовок, должен быть не больше 80 символов и не меньше 10 символов"/>
 
он как раньше работал, срабатывала валидация, и он из испута из  check_message="Введите заголовок, должен быть не больше 80 символов и не меньше 10 символов" выводил этот текст в всплывающем окне, а щас он выводит как я и хотел в див, но нет надписи этой.

Всего записей: 2112 | Зарегистр. 23-06-2006 | Отправлено: 07:27 24-07-2015 | Исправлено: newbies, 07:31 24-07-2015
Mavrikii

Platinum Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
newbies
зачем вы занимаетесь тем, что даже не пытаетесь понять?
 

Цитата:
а как вывести тот текст, что он выводил в окне всплывающем.

document.getElementById('validationka').innerHTML = element.getAttribute("check_message");
 
 

Всего записей: 15117 | Зарегистр. 20-09-2014 | Отправлено: 07:48 24-07-2015
newbies



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
я так и хотел сделать, попробовать, но не стал делать, так как в js нет опыта.
Еще маленький вопрос, а как применить класс стиля к данному сообщению, я применил на прямую так.
 
.validationka{
color: #FF2525;
font-size: 16px;
text-transform: uppercase;
margin-top: 20px;
margin-bottom: 20px;
border: 2px solid #FF2525;
padding: 10px;
background: #F5F5F5;
}
 
но видно блок и т.д !
 
а нужно что бы стиль задействовался когда срабатывает валидация и вылезает текст ошибки.

Всего записей: 2112 | Зарегистр. 23-06-2006 | Отправлено: 09:01 24-07-2015
Mavrikii

Platinum Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
newbies

Цитата:
а нужно что бы стиль задействовался когда срабатывает валидация и вылезает текст ошибки.

сделать
display: none;
по умолчанию и менять на  
display:block;
когда нужно

Всего записей: 15117 | Зарегистр. 20-09-2014 | Отправлено: 09:07 24-07-2015
newbies



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Вот так работает, так правильно ли:
 
document.getElementById('validationka').style.display = "block"
document.getElementById('validationka').innerHTML =element.getAttribute("check_message");    
 
Добавлено:
вопрос решен, большое спасибо.
не подскажите случайно по этому js
 
это подсчет сколько я символов ввел, я не могу понять где в скрипте поставить что бы он показывал строку подсчета, она появляется когда начинаю вводить символы.
 

Код:
 
$(function()
{
var maxLength = $('#textarea').attr('maxlength');  
$('#textarea').keyup(function()
{
var curLength = $('#textarea').val().length;
$(this).val($(this).val().substr(0, maxLength));  
var remaning = maxLength - curLength;
if (remaning < 0) remaning = 0;
$('#textareaFeedback').html(' - осталось ( '  +   remaning + ' ) символов ');
if (remaning < 15) // когда менять цвет
{
$('#textareaFeedback').addClass('warning')
}
else
{
$('#textareaFeedback').removeClass('warning')
}
})
})
 

Всего записей: 2112 | Зарегистр. 23-06-2006 | Отправлено: 09:22 24-07-2015
newbies



Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Доработал свойства js, а то не совсем хорошо было, если ошибка то кидало на див на текст ошибки валидации, так же если все ок, нет ошибок то кидало на верх, я вставил так.
 
document.getElementById('validationka').style.display = "block"
document.getElementById('validationka').innerHTML = element.getAttribute("check_message");    
window.scrollTo(500, 0);
 
теперь работает так, если есть ошибка то кидает на верх к валидации, если нет ошибки то не кидает.

Всего записей: 2112 | Зарегистр. 23-06-2006 | Отправлено: 11:30 24-07-2015
Открыть новую тему     Написать ответ в эту тему

Компьютерный форум Ru.Board » Интернет » Web-программирование » Валидация формы через element.getAttribute


Реклама на форуме Ru.Board.

Powered by Ikonboard "v2.1.7b" © 2000 Ikonboard.com
Modified by Ru.B0ard
© Ru.B0ard 2000-2024

BitCoin: 1NGG1chHtUvrtEqjeerQCKDMUi6S6CG4iC

Рейтинг.ru