Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Formularz
Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript
apup
2.07.2009, 22:07:48
Witam,
chciałem napisać kod sprawdzający poprawności wypełnionych pól w formularzu za pomocą javascript. Jednak nie działa. Po wpisaniu błędnych danych nic się nie dzieje. Powinno pojawić się okno z opisem źle wypełnionych pól, lecz nie pojawia się.

Poniżej umieszczać kod z pliku php oraz dołączonego do niego pliku pliku js.

Plik php.
[HTML] pobierz, plaintext 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <script language="javascript1.2" src="source.js" type="application/javascript"></script>
  5. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  6. <title>Untitled Document</title>
  7. </head>
  8.  
  9. <script language="javascript1.2" type="application/javascript">
  10.     function check_valid(form) {
  11.     var error = "";
  12.     error += verify_username(form.username.value);
  13.     error += verify_password(form.password.value);
  14.     error += verify_phone(form.phone.value);
  15.     error += verify_email(form.email.value);
  16.     if (error != "") {
  17.         alert(error);
  18.         return false;
  19.     }
  20.     return true;
  21. }
  22. </script>
  23.  
  24. <body bgcolor="#FFFFFF">
  25.  
  26. <form action="process.php" method="post" onsubmit="return check_valid(this)" id="test1" name="test1">
  27.     <table border="0" width="100%" cellspacing="0" cellpadding="0">
  28.         <tr>
  29.             <td width="30%" align="right">Nazwa użytkownika</td>
  30.             <td width="70%">: <input type="text" name="username" /></td>
  31.         </tr>
  32.         <tr>
  33.             <td align="right">Hasło</td>
  34.             <td>: <input type="password" name="password" /></td>
  35.         </tr>
  36.         <tr>
  37.             <td align="right">Telefon</td>
  38.             <td>: <input type="text" name="phone" /></td>
  39.         </tr>
  40.         <tr>
  41.             <td align="right">Email</td>
  42.             <td>: <input type="text" name="email" /></td>
  43.         </tr>
  44.         <tr>
  45.             <td>&nbsp;</td>
  46.             <td><input type="submit" value="Zatwierdz" /></td>
  47.         </tr>
  48.      </table>
  49. </form>
  50.  
  51. </body>
  52. </html>
[HTML] pobierz, plaintext


Plik js.
Kod
function verify_username (strng) {
       var error = "";
       if (strng == "") {
           error = "Nie wprowadzono nazwy użytkownika.\n";
       }
           var illegalChars = /\W/;
           if ((strng.length < 6) || (strng.length > 10)) {
               error = "Nazwa użytkownika ma nieprawodłow długość. Długość nazwy użytkownika musi mieścić się w zakresie od 6-10 znaków.\n";
           }
           else if (illegalChars.test(strng)) {
               error = "Nazwa użytkownika zawiera niedozwolone znaki.\n";
           }
       return error;
       }
      
   function verify_password (strng) {
       var error = "";
       if (strng == "") {
           error = "Nie wprowadzone haslo";
       }
           var illegalChars = /[\W_]/;
           if ((strng.length < 6) || (strng.length > 8)) {
               error = "Hasło ma nieprawodłow długość. Dlugość hasła musi mieścić się w zakresie od 6 do 8 znaków.\n";
           }
           else if (illegal.Chars.test(strng)) {
               error = "Hasło zawiera niedozlowone znaki.\n";
           }
           else if (!((strng.search(/(a-z)+/)) && (strng.search(/(A-Z)+/)) && (strng.search(/(0-9)+/)))) {
               error = "W haśle musi się znaleźć co najmniej jedna wielka litera, jedna mała litera i jedna cyfra.\n";
           }
       return error;
       }
  
   function verify_email (strng) {
       var error  = "";
       if (strng == "") {
           error = "Nie wprowadzono adresu e-mail użytkownika.\n";
       }
           var emailFilter=/^.+@.+\..{2,4}$/;
           if (!(emailFilter.test(strng))) {
               error = "Prosze wprowadzić prawidłowy adres email.\n";
           }
           else {
               var illegalChars = /[\(\)\<\>\,\;\:\\\"\[\]]/;
               if (strng.match(illegalChars)) {
                   error = "Adres email zawiera niedozwolone znaki.\n";
               }
           }
       return error;
       }
  
   function verify_phone (strng) {
       var error = "";
       if (strng = "") {
           error = "Nie wprowadzono numeru telefonu.\n";
       }
           var stripped = strng.replace(/[\(\)\.\-\ ]/g, '');
               if (isNaN(parseInt(stripped))) {
                   error = "Numer telefonu zawieta niedozwolone znaki.\n";
               }
               if (!(stripped.length == 10)) {
                   error = "Numer telefonu ma nieprawidłow długość. Należy wprowadzić numer telefonu wraz z numerem kierunkowym.\n";
               }
           return error;
           }
   }


Z góry dziękuję za pomoc.
Pawel_W
2.07.2009, 22:37:34
masz o 1 } za dużo ;]

cały skrypt:
[HTML] pobierz, plaintext 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <script type="text/javascript">
  5. function verify_username (strng) {
  6.        var error = "";
  7.        if (strng == "") {
  8.            error = "Nie wprowadzono nazwy użytkownika.\n";
  9.        }
  10.            var illegalChars = /\W/;
  11.            if ((strng.length < 6) || (strng.length > 10)) {
  12.                error = "Nazwa użytkownika ma nieprawodłow długość. Długość nazwy użytkownika musi mieścić się w zakresie od 6-10 znaków.\n";
  13.            }
  14.            else if (illegalChars.test(strng)) {
  15.                error = "Nazwa użytkownika zawiera niedozwolone znaki.\n";
  16.            }
  17.        return error;
  18.        }
  19.  
  20.    function verify_password (strng) {
  21.        var error = "";
  22.        if (strng == "") {
  23.            error = "Nie wprowadzone haslo";
  24.        }
  25.            var illegalChars = /[\W_]/;
  26.            if ((strng.length < 6) || (strng.length > 8)) {
  27.                error = "Hasło ma nieprawodłow długość. Dlugość hasła musi mieścić się w zakresie od 6 do 8 znaków.\n";
  28.            }
  29.            else if (illegal.Chars.test(strng)) {
  30.                error = "Hasło zawiera niedozlowone znaki.\n";
  31.            }
  32.            else if (!((strng.search(/(a-z)+/)) && (strng.search(/(A-Z)+/)) && (strng.search(/(0-9)+/)))) {
  33.                error = "W haśle musi się znaleźć co najmniej jedna wielka litera, jedna mała litera i jedna cyfra.\n";
  34.            }
  35.        return error;
  36.        }
  37.  
  38.    function verify_email (strng) {
  39.        var error  = "";
  40.        if (strng == "") {
  41.            error = "Nie wprowadzono adresu e-mail użytkownika.\n";
  42.        }
  43.            var emailFilter=/^.+@.+\..{2,4}$/;
  44.            if (!(emailFilter.test(strng))) {
  45.                error = "Prosze wprowadzić prawidłowy adres email.\n";
  46.            }
  47.            else {
  48.                var illegalChars = /[\(\)\<\>\,\;\:\\\"\[\]]/;
  49.                if (strng.match(illegalChars)) {
  50.                    error = "Adres email zawiera niedozwolone znaki.\n";
  51.                }
  52.            }
  53.        return error;
  54.        }
  55.    function verify_phone (strng) {
  56.        var error = "";
  57.        if (strng = "") {
  58.            error = "Nie wprowadzono numeru telefonu.\n";
  59.        }
  60.            var stripped = strng.replace(/[\(\)\.\-\ ]/g, '');
  61.                if (isNaN(parseInt(stripped))) {
  62.                    error = "Numer telefonu zawieta niedozwolone znaki.\n";
  63.                }
  64.                if (!(stripped.length == 10)) {
  65.                    error = "Numer telefonu ma nieprawidłow długość. Należy wprowadzić numer telefonu wraz z numerem kierunkowym.\n";
  66.                }
  67.            return error;
  68.            }
  69. </script>
  70. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  71. <title>Untitled Document</title>
  72. </head>
  73.  
  74. <body bgcolor="#FFFFFF">
  75. <script type="text/javascript">
  76. function check_valid(obj) {
  77. var error = "";
  78. error += verify_username(obj.username.value);
  79. error += verify_password(obj.password.value);
  80. error += verify_phone(obj.phone.value);
  81. error += verify_email(obj.email.value);
  82. if (error != "") {
  83. alert(error);
  84. return false;
  85. }
  86. return true;
  87. }
  88. </script>
  89. <form action="process.php" method="post" onsubmit="return check_valid(this)" id="test1" name="test1">
  90. <table border="0" width="100%" cellspacing="0" cellpadding="0">
  91. <tr>
  92. <td width="30%" align="right">Nazwa użytkownika</td>
  93. <td width="70%">: <input type="text" name="username" /></td>
  94. </tr>
  95. <tr>
  96. <td align="right">Hasło</td>
  97. <td>: <input type="password" name="password" /></td>
  98. </tr>
  99. <tr>
  100. <td align="right">Telefon</td>
  101. <td>: <input type="text" name="phone" /></td>
  102. </tr>
  103. <tr>
  104. <td align="right">Email</td>
  105. <td>: <input type="text" name="email" /></td>
  106. </tr>
  107. <tr>
  108. <td>&nbsp;</td>
  109. <td><input type="submit" value="Zatwierdz" /></td>
  110. </tr>
  111. </table>
  112. </form>
  113.  
  114. </body>
  115. </html>
[HTML] pobierz, plaintext
apup
2.07.2009, 22:43:56
Dzieki wielkie exclamation.gif

Nie mogłem tego znaleść przez tydzien.

Jesli mozesz tylko powiedziec w ktorym to bylo miejscu w oryginale winksmiley.jpg
Pawel_W
2.07.2009, 22:45:20
w pliku .js usun ostatni }

a w .html pozamieniaj script type="application/javascript" na "text/javascript"
apup
2.07.2009, 22:48:45
Dzięki wielkie winksmiley.jpg Teraz wszystko pięknie działa.
simsonen
30.08.2009, 10:03:22
Witam,
je również mam problem z walidacją formularza ale troche z innej beczki.
Mianowicie jeśli początek dokumentu rozpoczynam od
[HTML] pobierz, plaintext 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
[HTML] pobierz, plaintext

to walidacja nie działa;
jeśli z kolei wstawię same
[HTML] pobierz, plaintext 
  1. <html>
[HTML] pobierz, plaintext

to wszystko jest ok ale wtedy css się wywalają. Szukałem przyczyny pół dnia w necie ale jestem bezradny sad.gif
Co najgorsze w literaturze jest pierwsza wersja stosowana sad.gif
Proszę o pomoc a jeśli będzie potrzeba to wrzucę kody źródłowe plików.
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.