Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Walidacja pól w formularzu
Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript
MOniToR
Witam

Mam sobie taki skrypcik:

  1. function checkUsernameForLength(whatYouTyped) {
  2. var fieldset = whatYouTyped.parentNode;
  3. var txt = whatYouTyped.value;
  4. reg = /^[a-zA-Z0-9]{6,255}$/;
  5. wyn = whatYouTyped.value.match(reg);
  6. if (wyn !== null) {
  7. fieldset.className = "welldone";
  8. }
  9. else {
  10. fieldset.className = "";
  11. }
  12. }
  13. function checkPassword(whatYouTyped) {
  14. var fieldset = whatYouTyped.parentNode;
  15. var txt = whatYouTyped.value;
  16. if (txt.length > 3 && txt.length < 6) {
  17. fieldset.className = "kindagood";
  18. } else if (txt.length > 5 && txt.length < 17) {
  19. fieldset.className = "welldone";
  20. } else {
  21. fieldset.className = "";
  22. }
  23. }
  24. function checkEmail(whatYouTyped) {
  25. var fieldset = whatYouTyped.parentNode;
  26. var txt = whatYouTyped.value;
  27. if (/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/.test(txt)) {
  28. fieldset.className = "welldone";
  29. } else {
  30. fieldset.className = "";
  31. }
  32. }
  33. function addLoadEvent(func) {
  34. var oldonload = window.onload;
  35. if (typeof window.onload != 'function') {
  36. window.onload = func;
  37. } else {
  38. window.onload = function() {
  39. oldonload();
  40. func();
  41. }
  42. }
  43. }
  44. function prepareInputsForHints() {
  45. var inputs = document.getElementsByTagName("input");
  46. for (var i=0; i<inputs.length; i++){
  47. inputs[i].onfocus = function () {
  48. this.parentNode.getElementsByTagName("span")[0].style.display = "inline";
  49. }
  50. inputs[i].onblur = function () {
  51. this.parentNode.getElementsByTagName("span")[0].style.display = "none";
  52. }
  53. }
  54. }
  55. addLoadEvent(prepareInputsForHints);

Waliduje mi on każde wyznaczone pole osobno przy użyciu np. dla pola z nazwą użytkownika: onkeyup="checkUsernameForLength(this);"
Walidacja polega na tym, że obok pola wyświetla mi stosowną informację, jakie znaki może zawierać wpis a gdy wpis jest odpowiedni pojawia się zielone info, że wszystko jest ok.

Ładnie to wygląda ale jak teraz zrobić, żeby można było wcisnąć przycisk submit tylko wtedy kiedy wszystkie pola są zweryfikowane jako "welldone" questionmark.gif Dziękuje za pomoc:)
Spawnm
zamiast submit dajesz button z onclick do funkcji która sprawdza czy wszystko jest ok , jeśli tak to funkcja symulująca submit.
Ewentualnie daj div , w nim input button który podmienisz na submit jeśli będzie wszystko ok.
MOniToR
Cytat(Spawnm @ 10.03.2009, 16:57:10 ) *
zamiast submit dajesz button z onclick do funkcji która sprawdza czy wszystko jest ok

Tak właśnie chciałem zrobić tylko nie wiem jak powinna wyglądać funkcja która by zebrała od innych funkcji, czy wszystkie pole są zweryfikowane jako 'welldone'. Bo nie chcę tworzyć nie potrzebnie funkcji, która w sobie będzie zawierać to samo co funkcje sprawdzające pola, ponieważ chciałbym abym mógł ten skrypt stosować do formularzy zawierających większą ilość pól.

EDIT
Udało mi się:)
  1. function check_form() {
  2. if(checkPassword(document.basicform.password)==1) {
  3. return true;
  4. } else if(checkUsernameForLength(document.basicform.username)==1){
  5. return true;
  6. } else {
  7. alert("blad");
  8. return false;
  9. }
  10. }
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.