Навигация по сайту Оглавление Информация о клиенте
JavaScript и HTML-формы
Начнем с самого простого - подтверждения отправки HTML-формы.
Для совместного использования JavaScript и HTML-формы
надо задать параметр name команды form, чтобы из JavaScript
можно было обращаться к объектам HTML-формы.
<form method="POST" action="/cgi-bin/gb_show.exe"
name="testform">
...
<input type="button" value="Отправить
данные формы"
onClick="if(confirm('Вы уверены?')){testform.submit();}">
</form>
Обратите внимание, что кнопка "Отправить данные
формы" задается посредством type=buttom, а не type=submit,
т.к. отправка формы будет происходить не всегда, а в
зависимости от подтверждения пользователя. Ниже можете
нажать на кнопку и посмотреть результат действия HTML-скрипта.
При ответе ДА, данные формы отправятся на сервер, при
ответе НЕТ, ничего не произойдет. Такое подтверждение
полезно при удалении или редактировании каких-либо данных.
Мы использовали такие HTML-формы при создании администраторского
доступа к форуму и гостевой книге, где имелась возможность
редактировать и удалять записи.
Далее мы рассмотрим правильность ввода данных. Такие
функции полезны для клиента, в случае ошибки ему не
придется ждать отправки данных на сервер и получения
отрицательного результата. Для проверки ввода целого
числа в диапазоне от -5 до 10 используйте следующий
код.
<script language="JavaScript">
<!--
function checkInt(form, input, min, max)
{
var i = eval(form + "." + input + ".value");
if(i>=min && i<=max && i.indexOf(".")==-1)
return true;
else
{
alert("Вы должны ввести целое число в диапазоне
от " + min + " до " + max + " !");
eval(form + "." + input + ".select()");
eval(form + "." + input + ".focus()");
return false;
}
}
-->
</script>
Введите целое от -5 до 10 <input type="text"
name="int510" size=40
onBlur="checkInt('testform','int510',-5,10);">
При попытке переключиться на другой элемент формы будет
вызвана функция JavaScript checkInt. На вход этой функции
передается четыре параметра: имя формы, имя объекта
ввода данных, минимальное и максимальное значение.
Введите целое от -5 до 10
Если вам понадобится функция checkFloat для проверки
правильности ввода вещественных чисел, то из условия
if надо убрать следующую строчку "&& i.indexOf(".")==-1".
Условие i.indexOf(".")==-1 проверяет наличие
точки.
<script language="JavaScript">
<!--
function checkFloat(form, input, min, max)
{
var i = eval(form + "." + input + ".value");
if(i>=min && i<=max)
return true;
else
{
alert("Вы должны ввести вещественное число в диапазоне
от " + min + " до " + max + " !");
eval(form + "." + input + ".select()");
eval(form + "." + input + ".focus()");
return false;
}
}
-->
</script>
|