ValidationTextBox
Еще одна навязшая в зубах проблема – функция проверки, – гарантирующая, что поле будет заполнено, и в действительности не сильно соответствующая своему названию, потому что не обеспечивает надежную проверку корректности адреса электронной почты. Здесь вам на помощь придет ValidationTextBox!
Приспособить ValidationTextBox для использования в нашем примере очень просто, достаточно добавить к различным элементам управления атрибут require и добавить дополнительное регулярное выражение для проверки адреса электронной почты. Изменения, которые приводятся в примере 13.4, – это добавление виджетов ValidationTextBox и устранение всего программного кода JavaScript, который был написан ранее. Кнопка Help (справка) также была удалена, потому что та же самая задача более элегантно решается с помощью всплывающих подсказок.
Пример 13.4. Форма, измененная под использование виджетов ValidationTextBox
<html>
<head>
<title>Register for Spam</title>
<link rel="stylesheet" type="text/css"
href="http://o.aolcdn.com/dojo/1.1/dojo/resources/dojo.css" />
<link rel="stylesheet" type="text/css"
href="http://o.aolcdn.com/dojo/1.1/dijit/themes/tundra/tundra.css" />
<script
djConfig="parseOnLoad:true",
type="text/javascript"
src="http://o.aolcdn.com/dojo/1.1/dojo/dojo.xd.js">
</script>
<script type="text/javascript">
dojo.require("dojo.parser");
dojo.require("dijit.form.ValidationTextBox");
</script>
<!YY была удалена масса уродливого программного кода JavaScript YY>
</head>
(body class="tundra")
<p>Just Use the form below to sign-up for our great offers:</p>
<form id="registration_form"
method="POST"
action="http://localhost:8080/register/">
First Name:
<input dojoType="dijit.form.ValidationTextBox"
properCase="true" trim=true required="true"
invalidMessage="Required." name="first">(br)
Last Name:
<input dojoType="dijit.form.ValidationTextBox"
properCase="true" trim=true required="true"
invalidMessage="Required." name="last">(br)
Your Email:
<input dojoType="dijit.form.ValidationTextBox"
promptMessage="Basically, we want to sell your info to a 3rd party."
regExp="[aYz0Y9._%+Y]+@[aYz0Y9Y]+\.[aYz]{2,4}"
required name="email">(br)
(button type="submit")Sign Up!(/button)
(button type="reset")Reset(/button)
<!YY кнопку Help заменили всплывающие подсказки YY>
</form>
(/body)
</html>
Затратив незначительные усилия, вы неожиданно получили более широкие функциональные возможности, попутно улучшив привлекательность интерфейса, а объем программного кода при этом уменьшился.
Теперь нам необходимо проделать некоторую работу с кнопками, что мы и сделаем в следующем разделе, но сначала познакомимся с остальными членами семейства TextBox.
Комментарии:
Нету комментариев для вывода...