Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #11 (permalink)  
Старый 17.12.2021, 22:34
Аватар для voraa
Профессор
Отправить личное сообщение для voraa Посмотреть профиль Найти все сообщения от voraa
 
Регистрация: 03.02.2020
Сообщений: 2,743

Двух секунд может быть мало, а 10 слишком много... Не в секундах дело.
Ну как тебе объяснить...
Сообщения не должны посылаться в пустоту. Особенно сообщения об ошибках.
Они не должны самопроизвольно пропадать. Система должна убедиться, что юзверь их хотя бы увидел. Т.е они должны пропадать только после действий этого юзверя. Например он нажмет кнопку ОК на сообщении или закроет его крестиком или начнет редактировать поле в котором встретилась ошибка.
Ответить с цитированием
  #12 (permalink)  
Старый 17.12.2021, 22:57
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,105

voraa,
в данном случае делать полноценный вывод, считаю излишним, задание видимо тестовое, но и совсем оставлять без вывода ошибок тоже решил не корректно, считай что это "заглушка" типа console.log.
с выводами твоими согласен, но тут до продакшен ой как далеко.
Ответить с цитированием
  #13 (permalink)  
Старый 17.12.2021, 23:25
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,105

voraa,
а так? )))
<!DOCTYPE html>
<html>
<head>
    <title>Untitled</title>
    <meta charset="utf-8">
    <style type="text/css">
    </style>
    <script>
        document.addEventListener("DOMContentLoaded", function() {
            const form = document.getElementById("form");
            const inputs = Array.from(form.querySelectorAll(".validation"));
            const err = "Не все поля заполнены правильно!";
            function validation(input) {
                let txt = input.value.trim();
                let reg = /(^[^А-Яа-яЁё]+)|([^А-Яа-яЁё]+$)/g;
                txt = txt.replace(reg, '');
                reg = /[-\s]+/g;
                txt = txt.replace(reg, ([a, ...b]) => a);
                reg = /[^А-Яа-яЁё\s-]/g;
                txt = txt.replace(reg, '');
                txt = txt.toLowerCase();
                reg = /^./;
                txt = txt.replace(reg, a => a.toUpperCase());
                if (txt !== input.value) input.value = txt;
                return !!txt.length;
            }
            form.addEventListener("focusout", function({target}) {
                if (target = target.closest(".validation")) validation(target)
            })
            function validateAll()
            {
               let validate = inputs.every(validation);
               return validate
            }
            function personality()
            {
               let txt = inputs.map(({ value }) => value).join(" ");
               return txt
            }
            form.addEventListener("submit", function(event) {
                event.preventDefault();
                let validate = validateAll();
                if(validate) {
                let txt = personality();
                out.insertAdjacentHTML('beforeend', `<li>${txt}</li>`);
                form.reset();
                }
                else attention.innerHTML = err;
            })
            form.addEventListener("input", function({target}) {
            if (target = target.closest(".validation")  && attention.innerHTML === err) attention.innerHTML = "";
            })
        });
    </script>
</head>
<body>
    <form id="form">
        <input type="text" class="validation" id='surname' placeholder="Фамилия" />
        <input type="text" class="validation" id='name' placeholder="Имя" />
        <input type="text" class="validation" id='patronymic' placeholder="Отчество" />
        <button id="button" class="btn btn-success">Отправить</button>
    </form>
    <div id="attention"></div>
    <ul id="out"></ul>
</body>
</html>

Последний раз редактировалось рони, 18.12.2021 в 08:46.
Ответить с цитированием
  #14 (permalink)  
Старый 18.12.2021, 06:43
Новичок на форуме
Отправить личное сообщение для Paulsw01 Посмотреть профиль Найти все сообщения от Paulsw01
 
Регистрация: 02.07.2021
Сообщений: 7

Как сделать чтобы после правильной оправки формы форма очищалась, и каждый новый ввод не перезаписывал, а добавлял новый параграф?
Ответить с цитированием
  #15 (permalink)  
Старый 18.12.2021, 08:45
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,105

Сообщение от Paulsw01
Как сделать
а самому ...?
добавлено, пост #13
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Checkbox ajax unchecked не передает значение katalizator AJAX и COMET 10 05.04.2020 09:08
Форма отследить событие ввода в одной из полей Sergey1986 AJAX и COMET 4 30.05.2018 22:55
Разработать скрипт для ввода строки и поиска в ней фиксированной последовательности с marc Общие вопросы Javascript 2 02.12.2017 09:59
Регулярка для поля ввода числа Bab Общие вопросы Javascript 14 08.04.2017 19:11
Как заполнить значения для скрытых полей из <input type=”text”> ? Surlik jQuery 2 13.11.2012 00:43