ForumCała strona

Nawigacja

Aktualnie online

Gości online: 5

Użytkowników online: 0

Łącznie użytkowników: 25,352
Najnowszy użytkownik: Hotwind77

Logowanie

Nazwa użytkownika

Hasło



Zarejestruj się

Odzyskaj hasło

Shoutbox

Musisz zalogować się, aby móc dodać wiadomość.

jantom
29.04.2021 21:03:32
Wszystkiego najlepszego Przemku Smile

MajsterBieda
23.04.2021 01:38:02
Cool

JazOOn
19.04.2021 22:27:51
i jeszcze jeden i jeszcze raz....

jantom
19.04.2021 21:00:37
E tam, tragizujesz.

khaman
18.04.2021 23:41:08
Jak już główny admin staje się duchem, to wiedz, że coś się dzieje..

Pobierz nową wersję
Pobierz podręcznik
Zobacz inne oficjalne Supporty
Statystyki supportu
PHP-Fuson PL na Facebooku

RSS

Nawigacja

jQuery i PF v7 w jednym stali domu... cz.2

Napisane przez Wooya dnia 15 październik 2009 17:58 · 0 komentarzy · 5664 czytań · Drukuj · Facebook · Wykop

Streszczenie:

Czyli jak wymusić używanie przez użytkowników "trudnych" haseł oraz sprawdzenie poprawności adresu e-mail...

W poprzednim odcinku sprawdziliśmy, czy długość hasła jest prawidłowa. uzupełnijmy poprzedni skrypt o sprawdzanie siły hasła. W tym celu dodajemy funkcję getPasswordStrength() (znalezioną gdzieś w necie ;), która zwraca wartość int w zakresie 0-100. Dla silnego hasła zakładamy, że wartość musi być >=70:

?>
<script type='text/javascript'>
	function getPasswordStrength(H){
		var D=(H.length);
		if (D<4) { D=0 }
		if(D>5){D=5}
		var F=H.replace(/[0-9]/g,"");
		var G=(H.length-F.length);
		if(G>3){G=3}
		var A=H.replace(/\W/g,"");
		var C=(H.length-A.length);
		if(C>3){C=3}
		var B=H.replace(/[A-Z]/g,"");
		var I=(H.length-B.length);
		if(I>3){I=3}
		var E=((D*10)-20)+(G*10)+(C*15)+(I*10);
		if(E<0){E=0}
		if(E>100){E=100}
		return E
	}
    var profile_errors = 0;
    $(function(){
        $("input[@type=password]").blur(function(){
           profile_errors = 0;
           $("#"+$(this).attr("name")+"_validate").remove();
           if ($(this).val().length>0) {
             if ($(this).val().length<6 || $(this).val().length>20) {
	      $(this).after("<div style='background:yellow;border:1px solid red;color:red;padding:2px' id='"+$(this).attr("name")+"_validate'>Hasło musi posiadać minimum 6 i maksimum 20 znaków...</div>");
              profile_errors++;
             } else if (getPasswordStrength($(this).val())<70) {
	      $(this).after("<div style='background:yellow;border:1px solid red;color:red;padding:2px' id='"+$(this).attr("name")+"_validate'>Hasło musi być silne, czyli zawierać małe i duże litery, znaki specjalne oraz cyfry...</div>");
              profile_errors++;
             }
           }
        });
        $("input[@name=update_profile]").bind("click", function(){
            if (profile_errors>0) {
                alert("Niektóre pola zostały wypełnione nieprawidłowo!\nNie można zaktualizować profilu!");
                return false;
            }
        });
    });
</script>
<?php

W powyższym przykładzie dla każdego pola INPUT typu PASSWORD sprawdzimy długość oraz siłę hasła i nie pozwolimy na zapisanie profilu, jeżeli którykolwiek warunek nie zostanie spełniony.

Ok. Sprawę haseł mamy z głowy :) Zajmijmy się walidacją adresu email przed wysłaniem formularza profilu. W tym celu wykorzystamy funkcję isValidEmailAddress() (także znalezioną w necie ;). Zmieniamy także filozofię sprawdzania błędów, jako że będziemy także sprawdzać inne pola poza hasłem. W tym celu znów z pomocą przyjdą nam selektory jQuery. Każdy DIV z komunikatem błędu będzie posiadał klasę profile_errors. Przed wysłaniem formularza sprawdzimy liczbę selektorów z tą klasą i jeśli liczba będzie <> 0 wtedy wyświetlimy komunikat o błędzie:
?>
<script type='text/javascript'>
        function isValidEmailAddress(emailAddress) {
	  var pattern = new RegExp(/^(("[\w-\s]+")|([\w-]+(?:\.[\w-]+)*)|("[\w-\s]+")([\w-]+(?:\.[\w-]+)*))(@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][0-9]\.|1[0-9]{2}\.|[0-9]{1,2}\.))((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\.){2}(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\]?$)/i);
	  return pattern.test(emailAddress);
        }
	function getPasswordStrength(H){
		var D=(H.length);
		if (D<4) { D=0 }
		if(D>5){D=5}
		var F=H.replace(/[0-9]/g,"");
		var G=(H.length-F.length);
		if(G>3){G=3}
		var A=H.replace(/\W/g,"");
		var C=(H.length-A.length);
		if(C>3){C=3}
		var B=H.replace(/[A-Z]/g,"");
		var I=(H.length-B.length);
		if(I>3){I=3}
		var E=((D*10)-20)+(G*10)+(C*15)+(I*10);
		if(E<0){E=0}
		if(E>100){E=100}
		return E
	}
    $(function(){
        $("input[@type=password]").blur(function(){
           $("#"+$(this).attr("name")+"_validate").remove();
           if ($(this).val().length>0) {
             if ($(this).val().length<6 || $(this).val().length>20) {
	      $(this).after("<div class='profile_errors' style='background:yellow;border:1px solid red;color:red;padding:2px' id='"+$(this).attr("name")+"_validate'>Hasło musi posiadać minimum 6 i maksimum 20 znaków...</div>");
             } else if (getPasswordStrength($(this).val())<70) {
	      $(this).after("<div class='profile_errors' style='background:yellow;border:1px solid red;color:red;padding:2px' id='"+$(this).attr("name")+"_validate'>Hasło musi być silne, czyli zawierać małe i duże litery, znaki specjalne oraz cyfry...</div>");
             }       
           }
        });
        $("input[@name=user_email]").blur(function(){
            $("#"+$(this).attr("name")+"_validate").remove();
            if (!isValidEmailAddress($(this).val())) {
	      $(this).after("<div class='profile_errors' style='background:yellow;border:1px solid red;color:red;padding:2px' id='"+$(this).attr("name")+"_validate'>Podany adres email wygląda na nieprawidłowy...</div>");
            }
        });
        $("input[@name=update_profile]").bind("click", function(){
            if ($(".profile_errors").size()>0) {
                alert("Niektóre pola zostały wypełnione nieprawidłowo!\nNie można zaktualizować profilu!");
                return false;
            }
        });
    });
</script>
<?php

Właśnie uzyskaliśmy walidator profilu użytkownika, który sprawdza najważniejsze pola profilu PF v7. Oczywiście walidować można wszystkie pola, ale to zostawiam inwencji twórczej czytających ten artykuł ;)

W następnym odcinku... Nie wiem co, ale na pewno o jQuery i PF v7 ;)

Komentarze

Brak komentarzy. Może czas dodać swój?

Dodaj komentarz

Zaloguj się, aby móc dodać komentarz.

Oceny

Tylko zarejestrowani użytkownicy mogą oceniać zawartość strony
Zaloguj się lub zarejestruj, żeby móc zagłosować.

Brak ocen. Może czas dodać swoją?
Created by Arox Copyright (C) 2004
Copyright (C) 2004 - 2018 Ekipa PHP-Fusion.pl