Валидация формы JQuery
 

У меня есть файл .html и .css. Работаю в Brackets. При нажатии на кнопку на сайте, открывается типичная форма: имя, номер телефона, e-mail, и поле для текста. Все работает. Но нужно сделать проверку на корректность введенных данных с помощью библиотеки JQuery. Желательно отдельным js файлом (но сойдет и в html js функции).

P.S. С JS работаю только один день

Ну так выбирайте плагин, подключайте.

А уж с конкретно выбранным какие либо проблемы, тогда вопрос.

Какой плагин?

Все варианты кода, которые я находила в инете, у меня не работают

Вот что не работает, с тем и с вопросом. А плагин - это программный модуль, динамически подключаемый к основной программе.

Можно этот взять, можно иной. Иначе чего вы хотите услышать в ответ?

Задача в том, чтобы сделать все без плагина.


Есть некая кнопка, при нажатии которой появляется модальное окно с формой.

<div id="openModal" class="modalDialog">
        <div> <a href="#close" title="Закрыть" class="close">X Close </a>
            <form method="post" action="#">
                <input type="name" id="name" placeholder="Ваше имя!" required /><span id="validName"></span>
                
                <h1> <input name="submit" class="btn" type="submit" value=  "Ok!"  /></h1> </form>
             </div>
    </div>

Теперь мне нужно написать функцию для проверки валидности поля "Name" : поле должно состоять только из русских букв.

<input type="name" id="name" placeholder="Ваше имя (только русские)" pattern="[а-яёА-ЯЁ]{2,}" required />

H1 для Ок, это круто. :)

<script type="text/javascript" src="js/jquery-1.8.0.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $('#name').blur(function () {
                if ($(this).val() != '') {
                    var pattern = [а-я]/i;
                    if (pattern.test($(this).val())) {
                        $(this).css({
                            'border': '1px solid #569b44'
                        });
                        $('#valid').text('Верно');
                    }
                    else {
                        $(this).css({
                            'border': '1px solid #ff0000'
                        });
                        $('#valid').text('Не верно');
                    }
                }
                else {
                    $(this).css({
                        'border': '1px solid #ff0000'
                    });
                    $('#valid').text('Поле не должно быть пустым');
                }
            });
 });
    </script>

Пыталась так, но ничего не получается

Так просто??? Спасибо)

laimas,
Ой, а мы ж получается не используем JQuery?