Проверка правильности заполнения формы вариант №2

Сегодня я хочу продолжить тему проверки заполнения форм. Ранее, в заметке “Проверка правильности заполнения формы” я приводил пример наиболее простого способа предупреждения пользователя о ошибках, представляю вашему вниманию более “продвинутый” способ проверки с помощью JavaScript, который в случае неверного заполнения будет выводить “Alert” окно с подсказками на какие поля обратить внимание.

Пример формы обратной связи с сайта…

<FORM action="mail.php" method="post" name="forma" onsubmit="return check();">

<table>

    <tr>

        <td>

            <table width="100%">

            	<tr>

            		<td>ФИО* :</td>

                    <td align="right"><input type="text" value="" name="fio" maxlength="260"></td>

            	</tr>

            	<tr>

            		<td>E-mail* :</td>

                    <td align="right"><input type="text" value="" name="email" maxlength="260"></td>

            	</tr>

            	<tr>

            		<td>Телефон:</td>

                    <td align="right"><input type="text" value="" name="telefon" maxlength="100"></td>

            	</tr>

            </table>

        </td>

    </tr>

	<tr>

		<td>Текст сообщения* :</td>

	</tr>

    <tr>

		<td><TEXTAREA name="data" wrap="hard"></TEXTAREA></td>

	</tr>

	<tr>

		<td><input type="Submit" value="Отправить"  name="submit"></td>

	</tr>

</table>

<p>* Поля, обязательные для заполнения</p>

</FORM>

Данная форма выглядит следующим образом…

В данной форме у нас имеются поля с именами “fio, email и data” которые и проверяет ниже приведенный скрипт.

Далее сам JavaScript проверки заполнения полей.

function check()

	{

				arr_field=new Array("fio","email","data");

				arr_desc_field=new Array("Ф.И.О.","E-mail","Текст сообщения");

	mail=document.forms['forma'].elements['email'];
	error="";
	for(i=0;i
		{
		if(document.forms['forma'].elements[arr_field[i]].value=='')

			{

			if(error=='')

				document.forms['forma'].elements[arr_field[i]].focus();

			error+="-"+arr_desc_field[i]+"n";

			}

		}

    if(error=="")

    	{

		if (! mail.value.match ( /^[w_-.^]+@[w]([w-_.]*w)?.[w]+$/ ) )

			{

			 alert("Некорректно заполнено поле  E-mail");

			 mail.focus();

			 return false;

			}

		else

			{

			return true;

			}

    	}

    alert("Пожалуйста, заполните слудующие поля:n"+error);

	return false;

	}

Особенностью данного скрипта является то, что в нем реализована более менее нормальная проверка корректного ввода почтового ящика, т.е. корректного с точки зрения написания.

17-04-08 23:04:52

Контакты

	Моб. тел.: 8-097-99-22-00-6 E-mail: tarasishe@gmail.com Портфолио работ: http://mij.org.ua/ Деятельность: Создание сайтов, сайтов - визиток в Харькове, поддержка и размещение в Интернет.

Мои работы

	Мои сайты (50) Автосервис «VS auto» Железнодорожные и авиационные кассы в Харькове Спутниковое ТВ Viasat Сайт ЧФ ДЛюкс Белгород Сайт ТМ Bio-Latex Украина Фото портфолио мастера маникюра - Натали Yni.Com - Универсальные сети Сайт-визитка ТМ MkFoam KOLO Ортопедические матрасы Magniflex Торговая Марка МІНІ Triolan - Киев Avelanto Rising Force Online Мобильные новости Юридическая компания КОНСИЛЬЕРИ Михайлюк, Сороколат и Партнеры Мебельные ткани VIP SlobodaNET Улыбка Triolan - Полтава ФаворитТВ Корпусная мебель OOO "Прогресс - 1" Пойнтер клуб ООО "Энергия-Буд" Компания "Каскад - КСВ" Редизайн сайта BaluNET ООО "Фактор КОМ" Клуб "ПАФОС" ООО "ПФК Фактор, Лтд" POEXALI Экскурсии по городам Украины Фотографии городов Украины Караванский завод МАТРО МАРКЕТ Elite M-Shop Аренда квартир ЧФ "ДентаЛюкс" Counter-Strike BaluNET ООО "Декон" ООО "Паллада Плюс" Tarasishe portfolio BaluNET Customize Пескоструйное оборудование Video BaluNET ООО Механик-Центр Мегаполис Games BaluNET BaluNET Hardware Forum BaluNET Сайт Internet провайдера Мои баннеры (4) www.elite-mobile.org.ua mirc.medianet.ua www.media.balu.net.ua www.radio.balu.net.ua Мои скрипты (2) Скрипт вовода стоимости драгоценных металлов Погодный информер Мои визитки (3) Дизайн двухсторонней визитной карточки Визитка мастера маникюра - второй вариант Визитка мастера маникюра

Познавательно

	Поисковые системы (22) Gmail: новая функция в Labs — Apps Search Обновление интерфейса Google Images Ваша фотография на фоне google.com Рейтинг 1000 сайтов от Google Yandex.com альфа-версия поиска по иностранным сайтам Яндекс изменил User-Agent роботов META.UA разработала новый поиск в ҐУҐЛЕ Снежный скринсейвер от Яндекс Google Translator Toolkit Сайт статистики от Google Статистика поиска Google доступена на русском Google добавил опции в поиск по картинкам! Англоподсказка исправит ломаный английский Google раздаёт бесплатные визитки Подарки от Google Google подключил OCR-движок для индексации PDF Мобильный поиск картинок от Яндекса Яндекс вводит новые директивы Yandex теперь понимает Sitemap Яндекс раздает антивирус Касперского Поисковые операторы Google Что делать, если Яндекс забанил сайт SEO (3) Продвижение сайта - семантическое ядро Бесплатные методы продвижения сайтов SEO сервисы / SEO tools Программы (5) WebMoney-реклама на ТВ Text-To-Table – помощник в размножении статей Новый Google Toolbar Обзор синонимайзера Night ArticleGen IETester – проверяем совместимость 4х IE браузеров сразу JavaScript (7) Cloud Zoom - плагин для увеличения изображений JS Charts - генератор графиков и схем. Падающий снег на JavaScript Проверка правильности заполнения формы вариант №2 Проверка правильности заполнения формы Скрипт проверки качества пароля Меняем величину (размер) шрифта с javascript Разное (29) Virtual Private Server Бесплатные инструменты для проверки сайтов на доступность Новые шаблоны для форм в Google Docs YouTube исполнилось 5 лет Google-конверты Стартовая (домашняя) страница для браузера с любимыми сайтами Выиграйте ужин на двоих в ресторане любого из городов Украины 35 сайтов с бесплатными CSS шаблонами Google Gravity С новым 2010 годом Вас! 3December — всемирный день компьютерной графики Конкурс авторов от Opera Software Как вовремя узнать, что ваш сервер не работает? С днём вебмастера! В Украине началась регистрация кириллических доменов Число сайтов в Internet выросло до 186,73 млн WMRadio – радио для вебмастеров C новым, 2009м годом! Microsoft SkyDrive — теперь 25Гб Microsoft создает конкурента Wordpress Шпаргалки для разработчика МАМА: только 4.13% сайтов валидны Google обновляет PageRank Winamp обзавелся своим поиском Полезные сервисы часть вторая 10 бесплатных Primary и Seconadary DNS серверов Полезные сервисы для работы с поисковиками Социальные закладки как способ увеличения посещаемости CSS3 эффект – прячем картинку в тексте! Браузеры (8) Вышел Google Chrome 5.x(Stable) К сведению пользователей Opera 10.51 Internet Explorer Collection 1.6.0.5 - универсальный инсталлятор со всеми версиями браузера Интересный способ визуализации структуры рынка браузеров Browser Chooser Огонь распространяется или новое лого Firefox 3.5 Впечатления о Google Chrome Делаем таблицу стилей CSS только для IE CSS-верстка (13) CSS 3.0 генераторы Подборка CSS3 генераторов Таблица реализации CSS3-свойств в разных браузерах Градиент на css Эффект прозрачности для изображений Поддержка CSS в почтовых клиентах Делаем эффект наведения на блок Делаем "резиновую" форму Ссылки внутри большой “кликабельной” области Облако тегов - CSS оформление CSS: Необычная ссылка CSS: Позиционируем элемент точно в центре экрана CSS: регистр символов PHP скрипты (10) Вышел WordPress 3.0 “Thelonious” Вышел phpBB 3.0.7-PL1 Вышел WordPress 2.9 Вышел phpBB 3.0.6 Sypex Dumper обновился до версии 2 Скрипт точного времени Компрессия CSS таблиц средствами PHP Улучшенная сортировка списков с использованием PHP и CSS Определяем статус ICQ PHP ротатор баннеров Веб-мастеринг (36) Сайт про браузеры от Яндекса - способ приминения Google выпускает mod_pagespeed для Apache Коллекция шпаргалок для веб мастеров Cоздайте схему проезда к своему офису и встройте к себе на сайт Как определить хостера сайта [ 6 способов ] HTML5 Test Page Lightshot — удобный скриншотер Пасхальные яйца в PHP Страничка для счастливых обладателей IE6 Новый ВАЛИДНЫЙ шаблон на CSS для phpbb 3 Инструмент для юзабилити тестирования - Open Hallway Инструмент для юзабилити тестирования - Userfly В ряду Open Source CMS на ASP.NET прибыло Инструменты для CSS разработчика Five Second Test – бесплатный сервис юзабилити тестирования ClickHeat – небольшой, но весьма интересный сервис Google Website Optimizer 5 сервисов для анализа посещаемости вашего сайта Zend выпустила бета-версию собственной серверной сборки Скрипты в Photoshop phpMyAdmin 3 Инструмент для бекапа и восстановления баз данных MySQL Создание баннера над шапкой сайта 5 сборок WEB серверов 5 онлайн сервисов для работы с CSS Необычная страница для ошибки 404 Как сменить домен не потеряв аудиторию, тИЦ и PR Фиксированное положение фонового изображения Увеличение изображения без потери качества Боремся с копированием изображений. Способ № 2 Боремся с копированием изображений. Способ № 1 Обновляем дату на копирайте автоматически Справочник терминов вебмастера Sitemaps XML формат SEO оптимизация текста 7 рекомендаций по подготовке к запуску сайта Интересное (5) Туры в грецию Где отдохнуть летом ? История свопов Цифровая вселенная выросла до 1,2 зеттабайта Кофейные автоматы

	NewPort (Спасибо! Полезная статья. Б...) окна (а я уже вставил) vgigly (W8BYG0 lodxoidsplnl, [url=ht...) Алексей (Гарантированная экономия топ...) kirill (http://gameround.ru/ http://...)

+8 \097\ 99-22-00-6