Проверка формы с использованием Jquery - PullRequest
0 голосов
/ 15 сентября 2010
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Validation POC</title>
    <script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
    <script src="Scripts/jquery.validate.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
    $("#frm").validate({
        rules: {
            cname: {
                required: true
            },
            cemail: {
                required: true,
                email: true
            }
        },
        messages: {
            cname: "Please
    enter
    your
    name",
            cemail: {
                "Email
    is
    not
    validated"
            }
        }
    });
});
</script>
</head>
<body>
<form id="frm" action="" method="get">
 <fieldset>
   <legend>Validation POC</legend>
   <p>
     <label for="cname">Name</label>
     <em>*</em><input id="cname" name="name" size="25" />
   </p>
   <p>
     <label for="cemail">E-Mail</label>
     <em>*</em><input id="cemail" name="email"size="25"  />
   </p>
   <p>
     <input class="submit" type="submit" value="Submit"/>
   </p>
 </fieldset>
 </form>
</body>
</html>

Я пытаюсь выполнить проверку формы с помощью jquery validation . Я пытаюсь дать свои собственные сообщения об ошибках. Но этот код не работает.

Когда я пытался

 <input type="text" id="cemail" class="required"></input>

код работает нормально, но при этом я не могу выдавать пользовательские сообщения об ошибках. Пожалуйста, дайте мне знать, если я делаю что-то не так в верхнем коде.
РЕДАКТИРОВАТЬ: У меня есть еще одна проблема, если проверка не удается для любого элемента управления, я хочу изменить цвет фона этого элемента управления. И я также хочу удалить сообщение об ошибке по умолчанию.

Ответы [ 3 ]

1 голос
/ 15 сентября 2010
Формат

должен выглядеть следующим образом ...

$(document).ready(function() {
    $("#frm").validate({

        rules: {
            cname: {
                required: true
            },
            cemail: {
                required: true,
                email: true
            }
        },
        messages: {
            cname: { 
                required: "Please enter your name"
            },
            cemail: {
                email: "Email is not validated"
            }
        }
    });
});

cname и cemail - это значения атрибута name input.

демо

1 голос
/ 15 сентября 2010

Есть 2 проблемы, в основном вам нужно использовать атрибут name ( не id атрибут), поэтому name и email, а не cname и cemailза ваши правила.Кроме того, {} вокруг сообщения об ошибке email необходимо удалить.В целом вы хотите выглядеть следующим образом:

$("#frm").validate({
    rules: {
        name: { required: true },
        email: { required: true, email: true }
    },
    messages: {
        name: "Please enter your name",
        email: "Email is not validated"
    }
});​

Вы можете попробовать здесь .

1 голос
/ 15 сентября 2010

cemail и cname должны быть добавлены к элементам ввода как класс, а не как ID.

пример:

<input class="cemail" name="email" size="25"  />
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...