Проверка формы

Рейтинг: 2Ответов: 1Опубликовано: 23.01.2015

Сейчас вот так сделал

<html>
<head>
<script type="text/javascript" src="http://s89.ucoz.net/src/jquery-1.7.2.js"></script>
<script type="text/javascript" src="jquery.validate.min.js"></script>
<script type="text/javascript" src="myscripts.js"></script>
<script src="jquery.inputmask.js" type="text/javascript"></script>
<script src="jquery.inputmask.extensions.js" type="text/javascript"></script>
<script src="jquery.inputmask.date.extensions.js" type="text/javascript"></script>
<script src="jquery.inputmask.numeric.extensions.js" type="text/javascript"></script>
<script src="jquery.inputmask.custom.extensions.js" type="text/javascript"></script>
</head>
<body><br><Br><Br><br><Br><Br>
<center>
<form id="loginform" action="" method="post">
Ваш логин:

<input type="text" name="login" />

Ваш пароль:

<input type="text" name="pswd" id="phone"/>

<input type="submit" name="enter" value="Войти" /></form>
</center>

<script>
$("#phone").inputmask("(999) 999-99-99");
</script>
    </body>
    </html>

Содержимое myscripts.js

$(document).ready(function(){

    $("#loginform").validate({

       rules:{

            login:{
                required: true,
                minlength: 2,
                maxlength: 16,
            },

            pswd:{
                required: true,
                minlength: 10,
                maxlength: 10,
            },
       },

       messages:{

            login:{
                required: "Это поле обязательно для заполнения",
                minlength: "Имя должно быть минимум из 2 символов",
                maxlength: "Максимальное число символо - 16",
            },

            pswd:{
                required: "Это поле обязательно для заполнения",
                minlength: "Телефон должен состоять из 10 цифр",
                maxlength: "Телефон должен состоять из 10 цифр",
            },

       }

    });

}); //end of ready

Ответы

▲ 3Принят

Уважаемый @malcov, не надо изобретать велосипеды! За Вас уже все придумали, берите и используйте готовые библиотеки.

Для реализации пунктов 1-3 используйте jQuery Validation Plugin.

Вот вам две ссылки по его примнению:

  1. http://2develop.ru/jquery/proverka-poley-s-pomoshtyyu-jquery.html
  2. http://habrahabr.ru/post/180279/

P.S. Добавьте эти ссылки в закладки.

Для 4-го пункта используйте jQuery Masked Input.

С помощью параметра clearIncomplete мы можем указать, что необходимо очищать/НЕ очищать поле, если пользователь заполнил маску не до конца.

В вашем случае очищать поле не нужно, значит код будет таким:

$("#input").inputmask("d.m.y", { "clearIncomplete": false });

Ссылки по этой теме:

  1. http://www.compnot.ru/javascript/input-mask-sozdaem-masku-vvoda-na-jquery.html
  2. http://cyberapp.ru/2011/07/06/jquery-maskedinput/