Automatyczna walidacja JavaScript w CakePHP

Jak pisałem już ostatnio, w nowej wersji CakePHP pojawiło się kilka nowych rzeczy. Kolejną z nich jest ulepszona walidacja danych. Umożliwia ona np. dodanie kilku zasad dla jednego pola oraz wpisanie tekstu błędu zaraz obok zasady zamiast w widoku.

Poniżej przykład wykorzystania kilku właściwości nowej walidacji. Ostatnie pole “option3″ sprawdzane jest według starego mechanizmu, wcześniejsze wykorzystują opisane wyżej dwie nowe właściwości.

var $validate=array(
	'username'=>array(
		'between'=>array(
			'rule'=>array('between',6,16)
		),
	),

	'option'=>array(
		'required'=>VALID_NOT_EMPTY,
		'length'=>array(
			'rule'=>array('comparison','>',100),
				'message'=>'Wpisz wartość większą od 100'
		),
	),

	'option3'=>VALID_NOT_EMPTY,
);

Wpadłem na pomysł, aby na podstawie tej tabeli walidacji automatycznie wygenerować JavaScript, który sprawdzał by formularz według tych samych zasad.

Wymagało to małej zmiany samego modelu, aby przekazywał do helpera więcej informacji w tablicy validationErrors. Dodatkowo dodałem kilka nowych metod walidacji, np: selected – sprawdzenie, czy wybrano coś w elemencie select, podobnie metoda checked.

Druga zmiana to nadpisanie helpera Form. Dzięki temu nie trzeba w ogóle zmieniać wypieczonych widoków! W metodzie end, która zamyka formularz, dodawany jest JavaScript dodający walidację do każdego pola. Dołączany jest też skrypt validation.js, który zawiera funkcje sprawdzające dane. Dołącza on eventy onblur oraz onmouseup i onkeyup z opóźnieniem jednej sekundy sprawdzające każde pole. Po kliknięciu guzika wyślij wszystkie pola są również ponownie sprawdzane i w przypadku powodzenia guzik ten jest deaktywowany aby nie został ponownie kliknięty.

W helperze końcu pliku można na znaleźć również domyślne teksty komunikatów błędu, jeżeli w modelu dla którejś metody walidacji nie podamy wartości message. Dzięki temu nie musimy za każdym razem podawać tych komunikatów.

Do walidacji można również używać metody regex z parametrem zawierającym wyrażenie regularne. Parametr ten zostanie przekazany również do JavaScriptu sprawdzającego formularz.

Zachęcam do debugowania ponieważ nie udało mi się tego jeszcze do końca przetestować, aczkolwiek sam JavaScript działa zarówno pod IE6 i 7, FF 2 i 3 oraz Operą 9.5.

Wszystkie wymagane pliki ułożone w odpowiednich katalogach można pobrać stąd:
dla wersji CakePHP-RC2: http://www.reboo.pl/files/download/validation-rc2.zip
dla wersji CakePHP-RC3: http://www.reboo.pl/files/download/validation-rc3.zip

Implementacja dla poszczególnych wersji jest nieco inna ponieważ helper Form z przyczyn technicznych musiał zostać nadpisany. Komponent w razem z CakePHP w wersji RC3 został wykorzystany w kilku projektach przez co został nieco lepiej zdebugowany niż ten dla wersji RC2.