O FORMULARZACH

Formularze to podstawowa forma komunikacji z sklepem internetowym jak np. specjalistyczną księgarnią, agentem ubezpieczeniowym, biurem podróży, lub twoją witryną w celu nawiązania pierwszego kontaktu z jej użytkownikami.

O formularzach pisze wielu autorów opisując obszernie przeróżne rozwiązania i szczegóły ich budowy. W tej masie treści ginie najważniejszy szczegół, jak dane z formularza wysyłane są na określony adres e-mail. Otóż w pierwszym wierszu formularza musi być wpisany adres skryptu umieszczonego na serwerze twojego operatora. W tym wypadku jest to adres „/cgibin/formmail” współpracujący jedynie z formularzami umieszczonymi w tej samej domenie, co wywoływany formmail, w tym wypadku home. Więcej informacji na stronie   home.pl/dokumentacja/funkcjeserwera/cgi/formularze.

PRZYKŁAD 1  KOD  FORMULARZA: WIELOWIERSZOWY OBSZAR TEKSTOWY

 
<form action="/cgibin/formmail" method="post">
  <input type="hidden" name="recipient"  value="teleprawo@teleprawo.net" />
  <input type="hidden" name="subject" value="Uwagi o Bibliotece" />  
  	<textarea name="uwagi" rows="5" cols="67"> Proszę pisać: </textarea> 
  <div style="text-align:center;">
  <input type="submit" value="WYŚLIJ" />
  <input type="reset"  value="ANULUJ" />
  </div>
</form>

Formularz definiuje element form a jego atrybut action ustala adres skryptu /cgibin/formmail który zostanie wywołany po zatwierdzeniu formularza przyciskiem WYŚLIJ. Atrybut method z wartością post określa metodę protokołu HTTP przesyłu danych. Kontrolki typu hidden ukrywają wyświetlanie nazw, odbiorcy recipient oraz tematu subject i przesyłają do serwera atrybuty value. Element textarea tworzy obszar tekstowy 5 wierszy rows, każdy po 67 znaków cols. Kontrolka typu submit wysyła formularz, a typu reset kasuje wprowadzony tekst. Formularz zamyka element  </form>. Nazwa pliku z skryptem sugeruje że jest to aplikacja oparta na CGI (Common Gateway Interface) odpowiedzialna za przetwarzanie formularzy, pisana w języku Perl a ostatnio PHP.

WYŚLIJ UWAGI o Bibliotece TelePrawa

Pisanie uwag może nie wzbudzać zachwytu użytkownika tej strony. Łatwiejszą formą oceny Biblioteki może być wybór stopnia w skali od 2 do 5. Zastosowana kontrolka radio umożliwia wybór tylko jednej opcji. W wypadku pomyłki wybierając drugą opcję wyłączamy automatycznie pierwszą. Są to wykluczające się pola wyboru, opisane poniżej.

PRZYKŁAD 2 i 3  KOD  FORMULARZA: POLA WYBORU checkbox i WYKLUCZAJĄCE radio

 
<form action="/cgibin/formmail" method="post">
  <input type="hidden" name="recipient"  value="teleprawo@teleprawo.net" />
  <input type="hidden" name="subject" value="Ocena Biblioteki" />  
  	<input type="radio" name="ocena" value="5" /> Bardzo dobra <br />
	<input type="radio" name="ocena" value="4" /> Dobra <br />
	<input type="radio" name="ocena" value="3" /> Dostateczna <br />
	<input type="radio" name="ocena" value="2" /> Niedostateczna <br />
  <div style="text-align:center;">
  <input type="submit" value="WYŚLIJ" />
  </div>
</form>

W miejsce wiersza z kontrolką textarea znajdują się cztery wiersze z kontrolką radio. Po zaznaczeniu określonej kontrolki zostanie wybrana jej wartość value od 5 do 2. Zastosowana kontrolka radio umożliwia wybór tylko jednej opcji. Kontrolka typu submit wysyła formularz. Zrezygnowano z kontrolki typu reset kasującej. Wpisując w miejsce kontrolki radio kontrolkę typu checkbox otrzymujemy małe kwadratowe pole opcji, które można włączyć lub wyłączyć. Pozwala to na wybranie kilku opcji. Należy wtedy nazwy ocen zastąpić np. nazwą i ceną przedmiotów wystawionych do sprzedaży w internecie.

WYSTAW OCENĘ   Bibliotece TelePrawa

Bardzo dobra
Dobra
Dostateczna
Niedostateczna

PRZYKŁAD 4  KOD  FORMULARZA: LISTA SELECT

 
<form action="/cgibin/formmail" method="post">
  <input type="hidden" name="recipient"  value="teleprawo@teleprawo.net" />
  	<select name="Ocena z listy">
	<option value="0">Wybierz ocenę z listy</option>
  	<option value="Bardzo dobra">bardzo dobra</option>
	<option value="Dobra">dobra</option>
	<option value="Dostateczna">dostateczna</option>
	<option value="Niedostateczna">niedostateczna</option>
	</select> 
  <div style="text-align:center;">
  <input type="submit" value="WYŚLIJ" />
  </div>
</form>

W trzecim wierszu element select name wysyła do serwera nazwę „Ocena z listy” i wybraną opcję.

WYBIERZ OCENĘ   dla Biblioteki TelePrawa

INNE ELEMENTY FORMULARZA   i ich grupowanie oraz formatowanie

Inne elementy formularza to pola pozwalające wpisać jedną linie tekstu np. dane użytkownika, adres lub hasło. Dane te wpisuje użytkownik chcący skorzystać z oferowanych usług lub zakupu towaru, kod poniżej.

 
	<input type="text" name="email" />     Wpisz swój e-mail
    Wpisz swój e-mail

Grupowanie elementów formularza polega na tym że między trzy pierwsze wiersze z PRZYKŁAD 1 wpisujemy wcięte wiersze kontrolek z wszystkich przykładów a pod nimi wstawiamy ostatnie cztery wiersze z PRZYŁAD 4. Otrzymujemy jeden formularz z wszystkimi polami. Kontrolki poszczególnych składowych formularzy możemy otoczyć ramką używając do tego elementów fieldset oraz opisu stosując legend. Pożądany ostateczny wygląd formularza można uzyskać z pomocą stylów CSS. W celu uniknięcia błędów przy wprowadzaniu danych przez użytkownika stosuje się tzw. obsługę zdarzeń kontrolek formularza w języku JavaScript. Oprogramowanie to pozwala uniknąć podstawowych błędów takich jak pominięcie pola, wpisanie kodu pocztowego w niewłaściwy sposób i innych pomyłek. Mając własny serwer, kod przetwarzający dane z formularza piszemy najczęściej w języku PHP.

Tego typu notacja zgodna z konwencją XHTML i stosowana przez wszystkich autorów, wymienionych w prawej kolumnie, generuje wiersze z błędami w czasie walidacji. W przykład.1 3-wiersze, w przykład.2 i 3 6-wierszy, w ostatnim przykład.4 tylko 2-wiersze. Zastąpienie w pierwszym wierszu ostatniego znaku > pustym znakiem oraz znakiem /> zmniejszy liczbę błędnych wierszy w czasie walidacji do jednego. Układ działa nadal jednak jest to niezgodne z konwecją XHTML.