Witam.
Próbowałem zrobić skrypt formularza tak aby na bierząco była sprawdzana poprawność wpisanej wartości. Do tego celu skorzystałem ze skryptu znajdującego sie w książce:"Ajax - niezbędnik projektanta dynamicznych aplikacji" autorstwa Michaela Morrisona. Wszystko działa dobrze do czasu aż w dwóch polach nie skorzystam z tego samego sposobu sprawdzania. Problem polega na tym że wtedy sprawdza tylko pierwsze pole, drugiego nie sprawdza dlatego zże w span jest to samo id, ale nie za bardzo mam możliwość zmiany tego id ponieważ odnosi się ono do funkcji js. Formularz ma być generowany dynamicznie przez php wg wymagań indywidualnych.
Przykładowy kod pliku html:
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
div { padding-bottom:5px; }
span.help { color:#AA0000; font-style:italic; }
<script type="text/javascript" src="validatekit.js"> </script> <body onload="document.getElementById('something').focus()"> <div id="ajaxState" style="display:none; font-style:italic"></div> Wpisz numer telefonu:
<input id="phone" type="text" size="32" onblur= "validatePhone(this, document.getElementById('phone_help'))" />
<span id="phone_help" class="help"></span> Wpisz drugi numer telefonu:
<input id="phone" type="text" size="32" onblur= "validatePhone(this, document.getElementById('phone_help'))" />
<span id="phone_help" class="help"></span>
a kod załaczonego pliku js:
/* Ajax - zestaw narzędzi */
/* Funkcje do sprawdzania poprawności */
function validateNonEmpty(inputControl, helpControl) {
// Sprawdź czy pole zawiera jakikolwiek tekst
return validateRegEx(/.+/,
inputControl.value, helpControl,
"Proszę wprowadzić wartość.");
}
function validateInteger(inputControl, helpControl) {
// Najpierw sprawdź czy pole zawiera dane
if (!validateNonEmpty(inputControl, helpControl))
return false;
// Następnie sprawdź czy w polu wpisana jest liczba całkowita
return validateRegEx(/^[-]?\d*$/,
inputControl.value, helpControl,
"Proszę wprowadzić liczbę całkowitą.");
}
function validateNumber(inputControl, helpControl) {
// Najpierw sprawdź czy pole zawiera dane
if (!validateNonEmpty(inputControl, helpControl))
return false;
// Potem sprawdź czy w polu wpisana jest liczba
return validateRegEx(/^[-]?\d*\.?\d*$/,
inputControl.value, helpControl,
"Proszę wprowadzić liczbę.");
}
function validateZipCode(inputControl, helpControl) {
// Najpierw sprawdź czy pole zawiera dane
if (!validateNonEmpty(inputControl, helpControl))
return false;
// Potem sprawdź czy w polu wpisany jest kod pocztowy
return validateRegEx(/^\d{5}$/,
inputControl.value, helpControl,
"Proszę wprowadzić pięciocyfrowy kod pocztowy.");
}
function validatePhone(inputControl, helpControl) {
// Najpierw sprawdź czy pole zawiera dane
if (!validateNonEmpty(inputControl, helpControl))
return false;
// Potem sprawdź czy w polu wpisany jest numer telefonu
return validateRegEx(/^\d{3}-\d{3}-\d{4}$/,
inputControl.value, helpControl,
"Prosze wprowadzić numer telefonu (na przykład, 123-456-7890).");
}
function validateEmail(inputControl, helpControl) {
// Najpierw sprawdź czy pole zawiera dane
if (!validateNonEmpty(inputControl, helpControl))
return false;
// Potem sprawdź czy w polu wpisany jest adres e-mail
return validateRegEx(/^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/,
inputControl.value, helpControl,
"Proszę wprowadzić adres e-mail (na przykład, john@doe.com).");
}
function validateDate(inputControl, helpControl) {
// Najpierw sprawdź czy pole zawiera dane
if (!validateNonEmpty(inputControl, helpControl))
return false;
// Potem sprawdź czy w polu wpisana jest data
return validateRegEx(/(0[1-9]|[12][0-9]|3[01])[- /-](0[1-9]|1[012])[- /-](19|20)\d\d/,
inputControl.value, helpControl,
"Proszę wprowadzić datę (na przykład, 14.01.1975).");
}
function validateRegEx(regex, input, helpControl, helpMessage) {
if (!regex.test(input)) {
if (helpControl != null)
helpControl.innerHTML = helpMessage;
return false;
}
else {
if (helpControl != null)
helpControl.innerHTML = "";
return true;
}
}
pozdrawiam i proszę o pomoc.
Problem ze skryptem sprawdzania poprawności formularza
