Шаблон, pattern?

Question

Хорь Обыкновенный @XOPEK_32

Я хорек из Брянска

Шаблон, pattern?

Делаю, значит, страничку регистрации. Наткнулся на поле "Подтверждение пароля". Юзаю скрипт, получается сделать это поле. Вот скрипт:

function checkPP() {
                        if (document.getElementById('pass').value != document.getElementById('conf').value) {
                            alert ("Пароль и Подтверждение пароля не совпадают!")
                        }
                        else {
                            document.forms['forma'].submit();
                        }
                    }

pass - это первый раз введенный пароль, conf - второй раз, форма - все поля. Ну там фио, логин... Так вот. Если раньше в каждую строку input я вставил "required" и шаблон "pattern", то все шаблону и обязаловки слетели! То есть вылетает алерт, но если ничего во всех полях не написано (или написано не по шаблону) никакое уведомление типа "Заполните это поле" не вылетает!!! Как можно это исправить? Помогите плиз

Вопрос задан более трёх лет назад
100 просмотров

14 комментариев

Подписаться 2 Простой 14 комментариев

Хорь Обыкновенный @XOPEK_32 Автор вопроса

function checkPP() {
if (document.getElementById('pass').value != document.getElementById('conf').value) {
alert ("Пароль и Подтверждение пароля не совпадают!")
}
else {
document.forms['forma'].submit();
}
}

Написано более трёх лет назад
Хорь Обыкновенный @XOPEK_32 Автор вопроса

вот скрипт

Написано более трёх лет назад
Ivanq @Ivanq

checkPP где вызывается?

Написано более трёх лет назад
Хорь Обыкновенный @XOPEK_32 Автор вопроса

Ivanq, при нажатии на кнопку

Написано более трёх лет назад
Ivanq @Ivanq

XOPEK_32, Можете сделать небольшой fiddle или выложить HTML?

Написано более трёх лет назад
Хорь Обыкновенный @XOPEK_32 Автор вопроса

Регистрация

ФИО

E-mail

Пароль

Подтверждение пароля

Логин

Написано более трёх лет назад
Хорь Обыкновенный @XOPEK_32 Автор вопроса

Регистрация

ФИО

E-mail

Пароль

Подтверждение пароля

Логин

Написано более трёх лет назад
Хорь Обыкновенный @XOPEK_32 Автор вопроса

Как же вам отправить в виде кода?

Написано более трёх лет назад

Хорь Обыкновенный @XOPEK_32 Автор вопроса

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Регистрация</title>
    <meta charset="windows-1251"/>
    <link href="FOG.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<fieldset>
    <legend><font face="Century Gothic">Регистрация</font></legend>
    <form action="" method="post" class="contact" name = "forma">
        <div class="table">
            <div>
                <label class="fixedwidth"><font face="Century Gothic"><b>ФИО</b></font></label>
                <input required type="text"  name="contactname" pattern="[А-Яа-яЁё]{1,}\s[А-Яа-яЁё]{1,}\s[А-Яа-яЁё]{1,}" id="FIO" placeholder="Введите своё ФИО">
            </div>
            <div>
                <label for="email" class="fixedwidth"><font face="Century Gothic"><b>E-mail</b></font></label>
                <input required type="email" name="email" id="email" placeholder="Введите свой E-mail">
            </div>
            <div>
            <div>
                <label for="email" class="fixedwidth"><font face="Century Gothic"><b>Логин</b></font></label>
                <input required type="text" name="login" id="login" placeholder="Создайте Ваш логин">
            </div>
            <label class="fixedwidth"><font face="Century Gothic"><b>Пароль</b></font></label>
            <input required type="password" name="password" id="pass" placeholder="Создайте Ваш пароль">
        </div>
        <div>
            <script>
                function checkPP() {
                    if (document.getElementById('pass').value != document.getElementById('conf').value) {
                        alert ("Пароль и Подтверждение пароля не совпадают!")
                    }
                    else {
                        document.forms['forma'].submit();
                    }
                }
            </script>
            <label class="fixedwidth"><font face="Century Gothic"><b>Подтверждение пароля</b></font></label>
            <input required type="password" name="password2" id="conf" placeholder="Подтвердите пароль">
        </div>
        </div><!--Окончание раздела table-->
    </form>
    <div class="buttonarea">
        <input type="submit" value="Зарегистрироваться" onClick="checkPP()"/>
    </div>
</fieldset>
</body>
</html>

Написано более трёх лет назад

Хорь Обыкновенный @XOPEK_32 Автор вопроса

Ivanq, есть мысли?

Написано более трёх лет назад

Ivanq @Ivanq

XOPEK_32,

function checkPP() {
                    if (document.getElementById('pass').value != document.getElementById('conf').value) {
                        alert ("Пароль и Подтверждение пароля не совпадают!")
                    }
                    else {
                        document.forms['forma'].submit();
                    }
                }

->

function checkPP(e) {
                    if (document.getElementById('pass').value != document.getElementById('conf').value) {
                        alert ("Пароль и Подтверждение пароля не совпадают!")
                        e.preventDefault();
                    }
                }

onClick="checkPP()"
->
onclick="checkPP(event)"

Написано более трёх лет назад

Хорь Обыкновенный @XOPEK_32 Автор вопроса

Ivanq, если пароли разные, то выскакивает алерт, скрипт работает. Но если все по шаблонам и все правильно, когда я нажимаю на кнопку форма не отправляется, т. е. все имена, логины и пароли остаются на месте, а кнопка приобретает голубую каёмку.

Написано более трёх лет назад
Хорь Обыкновенный @XOPEK_32 Автор вопроса

кстати если ничего не заполнено так же кнопка приобретает каемку и ничего не отправляется, не выскакивает никакого оповещения типа "Заполните это поле"

Написано более трёх лет назад
Хорь Обыкновенный @XOPEK_32 Автор вопроса

спс заработало

Написано более трёх лет назад

Помогут разобраться в теме Все курсы

Нетология

Fullstack-разработчик на Python + нейросети

20 месяцев

Далее
Skillfactory

Профессия Веб-разработчик

12 месяцев

Далее
Академия Eduson

Fullstack-разработчик на JavaScript

11 месяцев

Далее

Пригласить эксперта

Ответы на вопрос 1

Комментировать

Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы

JavaScript

+2 ещё

Простой
Как сделать горизонтальный скролл стрелками?
- 1 подписчик
- вчера
- 101 просмотр
0

ответов
PHP

+2 ещё

Простой
Создание элемента с необычной формой и прозрачным фоном и рамкой?
- 1 подписчик
- 03 нояб.
- 124 просмотра
0

ответов
HTML

Простой
При клике на кастомную кнопку “Скачать” не происходит переход, хотя JS-обработчик отрабатывает. Как решить?
- 1 подписчик
- 29 окт.
- 160 просмотров
0

ответов
HTML

+1 ещё

Простой
Как создать карточки в рядах со смещением?
- 1 подписчик
- 28 окт.
- 107 просмотров
1

ответ
JavaScript

Простой
Как создать рисунок из PHP в Fabric.js?
- 2 подписчика
- 28 окт.
- 134 просмотра
1

ответ
JavaScript

+1 ещё

Простой
Какой скрипт загружает меню в Ютуб?
- 2 подписчика
- 27 окт.
- 241 просмотр
2

ответа
JavaScript

Простой
Как работать с разрозненными данными?
- 1 подписчик
- 21 окт.
- 237 просмотров
2

ответа
JavaScript

+1 ещё

Простой
Неправильно работает crypto.subtle.deriveKey в Firefox, баг или мой косяк?
- 2 подписчика
- 16 окт.
- 137 просмотров
0

ответов
JavaScript

Простой
Как подгружать xml с перерисовкой таблицы?
- 3 подписчика
- 14 окт.
- 189 просмотров
0

ответов
JavaScript

+2 ещё

Простой
Как решить задачку из контеста?
- 1 подписчик
- 13 окт.
- 264 просмотра
1

ответ
Показать ещё Загружается…

Fullstack Разработчик (Next.js / JavaScript / TypeScript)

App Company

от 200 000 до 300 000 ₽

Web-разработчик/WordPress программист (Full-stack)

JustBusiness • Санкт-Петербург

от 130 000 до 150 000 ₽

React разработчик

ITK academy • Нижний Новгород

от 50 000 до 90 000 ₽

function checkPP() {
if (document.getElementById('pass').value != document.getElementById('conf').value) {
alert ("Пароль и Подтверждение пароля не совпадают!")
}
else {
document.forms['forma'].submit();
}
}
XOPEK_32, Можете сделать небольшой fiddle или выложить HTML?
Регистрация

ФИО

E-mail

Пароль

Подтверждение пароля

Логин
<!DOCTYPE html> <html lang="en"> <head> <title>Регистрация</title> <meta charset="windows-1251"/> <link href="FOG.css" rel="stylesheet" type="text/css"/> </head> <body> <fieldset> <legend><font face="Century Gothic">Регистрация</font></legend> <form action="" method="post" class="contact" name = "forma"> <div class="table"> <div> <label class="fixedwidth"><font face="Century Gothic"><b>ФИО</b></font></label> <input required type="text" name="contactname" pattern="[А-Яа-яЁё]{1,}\s[А-Яа-яЁё]{1,}\s[А-Яа-яЁё]{1,}" id="FIO" placeholder="Введите своё ФИО"> </div> <div> <label for="email" class="fixedwidth"><font face="Century Gothic"><b>E-mail</b></font></label> <input required type="email" name="email" id="email" placeholder="Введите свой E-mail"> </div> <div> <div> <label for="email" class="fixedwidth"><font face="Century Gothic"><b>Логин</b></font></label> <input required type="text" name="login" id="login" placeholder="Создайте Ваш логин"> </div> <label class="fixedwidth"><font face="Century Gothic"><b>Пароль</b></font></label> <input required type="password" name="password" id="pass" placeholder="Создайте Ваш пароль"> </div> <div> <script> function checkPP() { if (document.getElementById('pass').value != document.getElementById('conf').value) { alert ("Пароль и Подтверждение пароля не совпадают!") } else { document.forms['forma'].submit(); } } </script> <label class="fixedwidth"><font face="Century Gothic"><b>Подтверждение пароля</b></font></label> <input required type="password" name="password2" id="conf" placeholder="Подтвердите пароль"> </div> </div> </form> <div class="buttonarea"> <input type="submit" value="Зарегистрироваться" onClick="checkPP()"/> </div> </fieldset> </body> </html>
XOPEK_32,

function checkPP() { if (document.getElementById('pass').value != document.getElementById('conf').value) { alert ("Пароль и Подтверждение пароля не совпадают!") } else { document.forms['forma'].submit(); } }

->
function checkPP(e) { if (document.getElementById('pass').value != document.getElementById('conf').value) { alert ("Пароль и Подтверждение пароля не совпадают!") e.preventDefault(); } }

onClick="checkPP()"
->
onclick="checkPP(event)"
Ivanq, если пароли разные, то выскакивает алерт, скрипт работает. Но если все по шаблонам и все правильно, когда я нажимаю на кнопку форма не отправляется, т. е. все имена, логины и пароли остаются на месте, а кнопка приобретает голубую каёмку.
кстати если ничего не заполнено так же кнопка приобретает каемку и ничего не отправляется, не выскакивает никакого оповещения типа "Заполните это поле"

Answer 1 · 2018-02-13 19:46:30

function checkPP() {
                    if (document.getElementById('pass').value != document.getElementById('conf').value) {
                        alert ("Пароль и Подтверждение пароля не совпадают!")
                    }
                    else {
                        document.forms['forma'].submit();
                    }
                }

->

function checkPP(e) {
                    if (document.getElementById('pass').value != document.getElementById('conf').value) {
                        alert ("Пароль и Подтверждение пароля не совпадают!")
                        e.preventDefault();
                    }
                }

onClick="checkPP()"
->
onclick="checkPP(event)"

Шаблон, pattern?

Войдите, чтобы написать ответ

Минуточку внимания

Войдите на сайт