Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #11 (permalink)  
Старый 27.02.2016, 19:16
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

v.classic,
не знаю
Ответить с цитированием
  #12 (permalink)  
Старый 28.02.2016, 12:46
Аватар для destus
Профессор
Отправить личное сообщение для destus Посмотреть профиль Найти все сообщения от destus
 
Регистрация: 18.05.2011
Сообщений: 1,207

v.classic,
В HTML5 нельзя указать браузеру, чтобы тот проверял валидность данных в поле, после того как в это поле будет что-то введено. Поэтому приходится всякими разными способами искусственным образом вызывать отправку форму с невалидными данными, чтобы показались таблички с ошибками. Этот скрипт выводит сообщение об ошибке, только когда вводим что-то во второе поле.
<style>
        input[type=password]:invalid {
            border: solid 2px red;
        }
    </style>
    <script>
        document.addEventListener('DOMContentLoaded', function () {
            var pass1 = document.querySelector('#password'),
                pass2 = document.querySelector('#password-check'),
                submit = document.querySelector('#submit');
            pass1.addEventListener('input', function () {
                this.value != pass2.value ? pass2.setCustomValidity('Пароли не совпадают') : pass2.setCustomValidity('');
            })
            pass2.addEventListener('input', function (e) {
                this.value != pass1.value ? this.setCustomValidity('Пароли не совпадают') : this.setCustomValidity('');
                !pass2.checkValidity() && submit.click();
            })
            submit.addEventListener('click', function (e) {
                pass1.value == '' && e.preventDefault();
            })
        })
    </script>
    <form class="form" action="address.txt" method="get">
        <input id="password" name="password" type="password" placeholder="Пароль">
        <input id="password-check" name="password-check" type="password" placeholder="Подтверждение пароля" title="">
        <input id="submit" name="submit" type="submit" value="Создать аккаунт">
    </form>
Ответить с цитированием
  #13 (permalink)  
Старый 28.02.2016, 13:35
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

Сообщение от destus
чтобы тот проверял валидность данных в поле, после того как в это поле будет что-то введено
Ну почему, и во время ввода, и после, он будет проверять, важно указать что.

<!DOCTYPE HTML> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
<style>
input:focus:invalid {
    color: #f00;
}  
</style> 
</head> 
<body>
<input pattern="\d+" />
</body> 
</html>
Ответить с цитированием
  #14 (permalink)  
Старый 28.02.2016, 13:46
Аватар для destus
Профессор
Отправить личное сообщение для destus Посмотреть профиль Найти все сообщения от destus
 
Регистрация: 18.05.2011
Сообщений: 1,207

Сообщение от laimas Посмотреть сообщение
Ну почему, и во время ввода, и после, он будет проверять, важно указать что.
Проверять будет, а показывать ошибку в виде сообщения? Без прикрутки дополнительного невидимого блока, который становится видимым, когда поле не соответствует указанному формату.
Ответить с цитированием
  #15 (permalink)  
Старый 28.02.2016, 13:50
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

Сообщение от destus
Проверять будет, а показывать ошибку в виде сообщения?

Ну тут надо определится, ибо сообщения показываются при отправке формы, и это логично.

Да и вообще, к нативной проверке валидности сравнение значений двух полей отношения не имеет, хотя можно в качестве pattern у поля имеющего фокус подставлять значение оппозитного поля.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Помогите найди ошибку в форме регистрации IONEX jQuery 7 20.08.2015 18:25
Помооогииитеее!!!)))Форма входа меняется на форму регистрации с помощью свойств visib dksu Элементы интерфейса 2 17.03.2013 13:15
Как сделать что бы при регистрации человека на моем сайте у него не появлялось... drunkwolfs Общие вопросы Javascript 2 07.08.2012 10:58
Проверка наличия логина в БД при регистрации, с помощью ajax storng Общие вопросы Javascript 4 09.04.2010 20:24