2.5 Проверка правильности заполнения формы.
Проверка правильности заполнения формы у клиента полезна, так как:
- снижает нагрузку на сервер, поскольку "плохие данные " будут
уже фильтрованы.
- сокращает задержки в случае ошибки пользователя. Поскольку при проверке
отсутствуют сетевые обращения.
- упрощает серверную программу.
Пример функции с проверкой правильности заполнения форм
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
function isaPosNum(s) {
return (parseInt(s) > 0) }
function qty_check(item, min, max) {
var returnVal = false
if (!isaPosNum(item.value)) alert("Please enter a postive number" )
else
if (parseInt(item.value) < min) alert("Please enter a " + item.name + " greater than " + min)
else if (parseInt(item.value) > max)
alert("Please enter a " + item.name
+ " less than " + max)
else returnVal = true return returnVal
}
function validateAndSubmit(theform){
if (qty_check(theform.quantity,0, 999))
{ alert("Order has been Submitted") return true }
else { alert("Sorry, Order Cannot Be Submitted!") return false } }
</SCRIPT>
</HEAD>
isaPosNum - простая функция, которая возвращает TRUE, если аргумент
-положителен, и FALSE - иначе. qty_check имеет три аргумента: item - соответствующий
элементу формы и минимальное и максимальное допустимое значение. Эта функция
проверяет значение item, которое должно находиться между min и max, и вызывает
alert-бокс, если это не так.
validateAndSubmit имеет в качестве аргумента форму и использует qty_check,
чтобы проверить значение элемента формы и принимает форму, если она заполнена
правильно, или вызывает alert-бокс и не принимает форму.
В следующем примере выполняется вызов этих функций: qty_check- как программы-обработчика
onChange для текстового поля и validateAndSubmit- как обработчика onClick
для клавиши
<BODY>
<FORM NAME="widget_order" ACTION="lwapp.html"
METHOD="post">How many widgets today?
<INPUT TYPE="text" NAME="quantity"
onChange="qty_check(this, 0, 999)">
<BR> <INPUT TYPE="button"
VALUE="Enter Order" onClick="validateAndSubmit(this.form)">
</FORM>
</BODY>
Форма выглядит следующим образом:
Эта форма задает значение для LiveWire-приложения, названного lwapp.html.
[ Оглавление ] [ Дальше ]
|