Wyręczanie użytkowników w wypełnianiu formularzy
Zwykle ograniczamy się tylko do walidowania poprawności danych wprowadzanych w formularze. A czy zastanawiałeś się kiedykolwiek, czy jesteś w stanie za użytkownika uzupełnić niektóre pola formularza? Nawet jeśli się zastanawiałeś, to rozmyślania pewnie zakończyły się stwierdzeniem, a skąd niby mam wyciągnąć dane użytkownika?! Niektórzy radzą sobie w ten sposób, że zapisują dane wpisane formularzach w ciasteczku i potem uzupełniają kolejne formularze tymi danymi. Jest to skuteczna metoda do czasu skasowania lub wygaśniecia ciasteczka. Tym wstępem chciałem zainteresować czytelników obiektem navigator.userProfile, który udostępnia nam AFAIK tylko Internet Explorer. Za jego pomocą możemy odczytać dane użytkownika z jego systemowej wizytówki vCard. Warunkiem powodzenia działania skryptu, który napiszemy będzie wcześniejsze utworzenie takiej wizytówki w systemie użytkownika.
Formularz
Pracę zaczniemy od utworzenia formularza, w którym będziemy oczekiwać podstawowych danych osobowych.
<form method="post" action="">
<p><label>Imię: <input type="text" name="imie" /></p>
<p><label>Nazwisko: <input type="text" name="nazwisko" /></p>
<p><label>e-mail: <input type="text" name="email" /></p>
<p><label>Telefon: <input type="text" name="tel" /></p>
<p><input type="submit" id="submit"></p>
</form>
Przymiarki do skryptu
Najpierw powinniśmy się zdecydować, czy chcemy, żeby pola zostały uzupełnione po załadowaniu się strony, czy dopiero po akcji użytkownika, np. po kliknięciu w przycisk. Kluczowym faktem, który pomoże podjąć decyzję jest, że użytkownik zawsze będzie proszony o zezwolenie (potwierdzenie) na pobranie danych osobowych. Dlatego uważam, że wypełnienie formularza powinno odbyć się dopiero po kliknięciu w przycisk.
Specyfikacja obiektu i jego metod
Obiekt navigator.userProfile posiada 4 metody
clearRequest()
Metoda ta służy do czyszczenia kolejki rządań danych osobowych użytkownika. Prościej mówiąc, jeśli wcześniej wykonywaliśmy już odczyt danych z wizytówki i chcelibyśmy wykonać operację od nowa, musimy wyczyścić kolejkę z danych pobranych ostatnim razem.
Metoda clearRequest nie oczekuje żadnych argumentów.
addReadRequest(name)
Metoda ta dodaje do kolejki rządań kolejne nazwy pól wizytówek vCard, które mamy zamiar odczytać.
Metoda oczekuje jednego argumentu - predefiniowanego zestawu nazw, tj. 'vCard.nazwa', np. 'vCard.FirstName'. Jeśli spróbujemy dodać do kolejki nieprawidłowy parametr, zostanie on zignorowany.
Poniżej przedstawiam listę wszystkich dozwolonych nazw:
- vCard.Business.City
- vCard.Business.Country
- vCard.Business.Fax
- vCard.Business.Phone
- vCard.Business.State
- vCard.Business.StreetAddress
- vCard.Business.URL
- vCard.Business.Zipcode
- vCard.Cellular
- vCard.Company
- vCard.Department
- vCard.DisplayName
- vCard.Email
- vCard.FirstName
- vCard.Gender
- vCard.Home.City
- vCard.Home.Country
- vCard.Home.Fax
- vCard.Home.Phone
- vCard.Home.State
- vCard.Home.StreetAddress
- vCard.Home.Zipcode
- vCard.Homepage
- vCard.JobTitle
- vCard.LastName
- vCard.MiddleName
- vCard.Notes
- vCard.Office
- vCard.Pager
doReadRequest(usageCode)
Metoda ta dokonuje faktycznego pobrania danych z wizytówki. Użytkownik zostanie poproszony o zezwolenie na odczyt danych, chyba, że dana witryna posiada już prawa odczytu.
Metoda oczekuje jednego obowiązkowego argumentu (tutaj nazwanego usageCode), który oznacza informację o tym, jak dana witryna zamierza użyć udostępnianych informacji.
Dopuszczanymi wartościami są liczby całkowite od 0 do 12, które oznaczają kolejno
- - Używane wyłącznie do administrowania systemem i zasadami jego działania, jak np. rozpoznawanie problemów w witrynie
- - Używane do badań i projektowania produktów
- - Używane do ukończenia bieżącej transakcji, np. zakupu
- - Używane do dostosowania zawartości projektu witryny do Twoich potrzeb
- - Używane do ulepszenia zawartości witryny łącznie z ogłoszeniami
- - Używane do wysyłania do Ciebie uaktualnien witryny sieci Web
- - Używane do kontaktu z Tobą w sprawach marketingu usług lub produktów
- - Połączone z innymi informacjami o Tobie
- - Używane przez witrynę do innych celów
- - Udostępnianie innym w celu dostosowania lub ulepszenia zawartości projektu witryny
- - Udostępnianie innym dla umozliwienia kontaktu z Tobą w sprawach marketingu usług i/lub produktów
- - Udostępnianie innym dla umozliwienia kontaktu z Tobą w sprawach marketingu usług i/lub produktów. Istnieje możliwość wyłączenia udostępniania danych
- - Udostępnianie innym w dowolnym celu
Pozostałe argumenty są opcjonalne, dlatego po szczegóły odsyłam do dokumentacji .
getAttribute(name)
Metoda zwraca dane pobrane z wizytówki z pola o nazwie przekazanej jako argument lub null gdy dane dla danego parametru nie istnieją.
Dozwolone wartości argumentu name zostały omówione wyżej, przy opisie metody addReadRequest.
Kod skryptu
if(window.navigator&&navigator.userProfile){
var t=document.createElement('input')
t.setAttribute('type','button')
t.setAttribute('value','Wypełnij formularz')
t.setAttribute('title','Po kliknięciu w przycisk poproszony zostaniesz o zezwolenie na odczyt danych osobowych z wizytówki vCard')
t.onclick=function(t){
t=navigator.userProfile;
t.clearRequest();
t.addReadRequest('vCard.FirstName');
t.addReadRequest('vCard.LastName');
t.addReadRequest('vCard.Email');
t.addReadRequest('vCard.Business.Phone');
// ...
t.doReadRequest(3,'userProfile test');
this.form.imie.value=t.getAttribute('vCard.FirstName');
this.form.nazwisko.value=t.getAttribute('vCard.LastName');
this.form.email.value=t.getAttribute('vCard.Email');
this.form.tel.value=t.getAttribute('vCard.Business.Phone');
// ...
t.clearRequest();
}
document.getElementById('submit').parentNode.appendChild(t);
}
Skrypt w akcji
Skrypt można przetestować na przygotowanej stronie testowej.
Jakaś alternatywa?
Niektórych może zniechęcać okno dialogowe z koniecznością zezwolenia na odczyt danych. Istnieje pewna alternatywa, która pozwala wykorzystywać dane z wizytówek. Można wykorzystać funkcjonalność autouzupełniania formularzy, aby proponowała dane z wizytówki.
Jedyne co użytkownik musi zrobić to zaznaczyć opcję autouzupełniania dla formularzy w opcjach internetowych w zakładce Zawartość/Informacje osobiste.
Dla webmastera sprawa wygląda bardzo prosto. Wstawiamy do formularza pola tekstowe z dodatkowym atrubutem VCARD_NAME, np.
<input type="text" name="email" VCARD_NAME="vCard.Email">
którego wartości wymieniłem w momencie omawiania metody addReadRequest. W momencie, gdy użytkownik będzie wprowadzał dane do pola, przeglądarka wyświetli listę z propozycjami danych pobranymi z wizytówki.
Tutaj też przygotowałem prosty przykład.
Podsumowanie
Funkcjonalność jaką oferuje obiekt navigator.userProfile może i jest ciekawa. Nasuwa się pytanie, dlaczego jest to tak rzadko wykorzystywane na stronach? Strzelam, że powodem jest z jednej strony nieznajomość tego obiektu przez webmasterów, z drugiej strony niewielu użytkowników tworzy sobie taką systemową wizytówkę vCard. A szkoda!
Komentarze dla notki “Wyręczanie użytkowników w wypełnianiu formularzy”
-
forgems - 19 lutego 2007, 14:56:56
Jak można się z panem skontaktować?
Mój jid to forgems@gmail.com, prosiłbym o kontakt jeśli jest pan zainteresowany pracą.


Subskrybuj