Który element umożliwia przesłanie formularza. Formularze w HTML. Grupa elementów listy

💖 Podoba Ci się? Udostępnij link swoim znajomym

Niejednokrotnie spotkaliśmy się ze stronami internetowymi, które proszą nas o wprowadzenie danych w pola wejściowe. HTML posiada mechanizm odbierania danych od użytkownika. Oczywiście dane te nadal wymagają przetworzenia, ale robią to wyspecjalizowane programy. Rozważmy mechanizm ich interakcji ze stronami internetowymi.

Zatem użytkownik pobrał stronę internetową, na której znajdują się elementy sterujące służące do wprowadzania informacji. Wszystko to łączy się we wspólny agregat zwany formularz. Każdy formularz posiada przycisk, po kliknięciu wprowadzone przez użytkownika dane przekazywane są do programu przetwarzającego. Ten program jest hostowany na serwerze internetowym, który obsługuje tę stronę. Takie programy można tworzyć przy użyciu różnych technologii programistycznych. Łączy je tylko jedna procedura odbierania danych ze strony internetowej. Dane są przesyłane za pomocą interfejsu bramy CGI (Common Gateway Interface). Dlatego programy przetwarzające są często nazywane aplikacjami CGI lub skryptami CGI.

Aplikacja otrzymuje więc dane i je przetwarza. Następnie może albo wysłać wiadomość e-mail, albo wykonać jakąś operację w bazie danych, albo wysłać użytkownikowi nową stronę WWW, możliwe działania ograniczone są jedynie właściwościami technologii i wyobraźnią programisty. Za pomocą takich programów działają wszelkiego rodzaju systemy rejestracji, systemy opinii, księgi gości, fora i czaty. Za ich pomocą powstają bardziej rozbudowane i złożone systemy, np. sklepy internetowe.

Aby tworzyć takie aplikacje, trzeba jeszcze umieć programować i znać odpowiednie zasady tworzenia aplikacji CGI. Dopóki nie będziemy wiedzieć, jak to zrobić, będziemy musieli ponownie skorzystać z publicznie dostępnych skryptów CGI. Ale nawet jeśli otrzymamy te aplikacje, formularz do wprowadzania danych przez użytkownika nadal musi zostać utworzony niezależnie. W tej sekcji dowiemy się, jak to zrobić.

Formularz jest ograniczony tagami I . Pomiędzy tymi tagami znajdują się tagi tworzące uprawnienia do wprowadzania informacji oraz tagi do tworzenia zwykłej zawartości strony internetowej, czyli same uprawnienia wejściowe można umieścić w tabeli, która z kolei w całości znajduje się w formularzu. Etykietka nie tworzy żadnej widocznej struktury. Przeznaczony jest raczej do wewnętrznego grupowania obiektów.

Znacznik posiada oczywiście szereg parametrów ustalających właściwości tworzonego formularza. Przyjrzyjmy się tym parametrom.

  • Parametr działanie jest obowiązkowe. Jego wartością jest adres URL wskazujący lokalizację aplikacji CGI, która będzie przetwarzać dane wprowadzone przez użytkownika za pomocą kontrolki tego formularza.
  • Parametr metoda ma na celu określenie sposobu przekazania danych do aplikacji przetwarzającej. Jako wartość parametru używane jest jedno z dwóch wstępnie ustawionych słów kluczowych: Dostawać Lub post. Teraz nie musimy dowiedzieć się, jakie mechanizmy są wdrażane przy użyciu tej lub innej metody. Tak czy inaczej, dokumentacja dołączona do aplikacji CGI wskazuje, jaką metodę przesyłania danych należy zastosować. Domyślna ikona to Dostawać.
  • Parametr typ en służy do wskazania rodzaju danych, które należy podać z formularza. Zwykle nie ma potrzeby go używać, ponieważ wartość application/x-www-form-urlencoded, ustawienie domyślne, jest idealne dla zdecydowanej większości aplikacji CGI.
  • Parametr akceptowanie-charset stosowane w przypadkach, gdy użytkownik przenosi nie tylko informacje, ale także pliki z formularza do aplikacji. W takim przypadku możemy jednoznacznie określić kodowanie przesyłanych plików. Wartością tego parametru jest ciąg tekstowy, w którym zapisana jest jedna lub więcej nazw kodowania. Jeśli używanych jest kilka kodowań, ich nazwy oddziela się spacjami lub przecinkami. Wartość domyślna to nieznany który mówi serwerowi, że musi ustalić użyte kodowanie
  • Parametr zaakceptować określa typy plików do przesłania. Zwykle nie jest używany, ponieważ serwer jest w stanie odpowiednio rozpoznać typ odbieranego pliku.
  • Parametr nazwa pozwala określić unikalną nazwę formularza. Naturalnie na jednej stronie internetowej może znajdować się kilka formularzy. W takim przypadku wartości parametrów nazwy nie powinny się zgadzać.

Etykietka z zamykającym się bliźniakiem w istocie utwórz pojemnik do umieszczenia organów wejściowych informacji. Większość tych danych wejściowych jest implementowana przy użyciu znacznika . Pokażmy to na małym przykładzie (ryc. 1.32).

Listowanie 1.33





Pole do wpisania linijki tekstu< input type="text">




Ryż. 1,32. Okno przeglądarki pokazujące wynik pliku pokazanego na Listingu 1.33

Tak więc na ilustracji widać, że udało nam się stworzyć pole do wprowadzania tekstu oraz przycisk, po kliknięciu wprowadzone przez użytkownika informacje zostaną przesłane do aplikacji CGI w celu przetworzenia. A jeśli spojrzymy na kod aukcji, zobaczymy, że zarówno przycisk, jak i pole wejściowe zostały utworzone przy użyciu tego samego tagu . Właściwości tego tagu są dostosowywane za pomocą jego licznych parametrów, które teraz rozważymy.

  • Parametr typ jest być może kluczowym parametrem. Korzystając z jego wartości, możemy ustawić typ kontrolki, która ma zostać utworzona. Wartość jest jednym z następujących słów kluczowych: tekst, hasło, pole wyboru, radio, przesyłanie, resetowanie, plik, ukryte, obraz, przycisk. Wartość domyślna to tekst. Przyjrzymy się tym typom bardziej szczegółowo nieco później.
  • Parametr nazwa zaprojektowany do ustawiania unikalnych nazw dla każdej kontrolki. Chociaż ten parametr jest opcjonalny, jest wysoce zalecany. Dokumentacja towarzysząca aplikacjom CGI musi wskazywać, w jaki sposób należy nazwać odpowiednie organy wprowadzania informacji.
  • Parametr wartość służy do określenia domyślnej wartości wyświetlanej dla przycisków i pól wprowadzania tekstu. Jeśli użyjemy przycisków opcji, to wartość parametru wartość nie będzie widoczna dla użytkownika, ale jest to wartość, którą otrzyma aplikacja przetwarzająca CGI, jeśli użytkownik wybierze odpowiedni przycisk opcji.
  • Parametr sprawdzony Używany tylko do niezależnych przełączników i przycisków radiowych. Ustawia ich stan początkowy. Jeśli ten parametr zostanie wprowadzony do tagu, przełącznik zostanie przełączony w stan włączony. Parametr jest używany bez wartości.
  • Parametr wyłączony sprawia, że ​​kontrola jest niedostępna dla użytkownika. Parametr jest używany bez wartości.
  • Parametr tylko czytać Dotyczy tylko treści wejściowych typów haseł tekstowych. Użycie tej opcji oznacza, że ​​dane wyświetlane w tych polach nie podlegają zmianie.
  • Parametr rozmiar zwykle określa wymiary organu wejściowego danych. Ale dla każdego typu narządu wejściowego jego działanie jest specyficzne.
  • Parametr maksymalna długość pozwala ustawić maksymalną możliwą liczbę znaków, jakie użytkownik może wpisać w pola tekstowe. Wartość parametru jest dodatnią liczbą całkowitą.
  • Parametr źródło używane w przypadkach, gdy tworzymy kontrolki wejściowe związane z grafiką. Wartością tego parametru jest adres URL pliku graficznego zawierającego wyświetlany obraz.
  • Parametr alt umożliwia utworzenie krótkich opisów tworzonego uprawnienia do wprowadzania danych. Opis ten może zostać wyświetlony jako mała wskazówka, gdy użytkownik najedzie kursorem myszy na ten element wejściowy.
  • Parametr tabindex określa numer kontrolki w sekwencji wszystkich obiektów, fokus wejściowy przesuwany jest pomiędzy nimi poprzez kolejne naciśnięcia klawisza Tab.
  • Parametr klucz dostępu umożliwia ustawienie „klawisza skrótu”, po naciśnięciu przez użytkownika fokus wejściowy zostanie przeniesiony na tę kontrolkę.

Przyjrzeliśmy się więc parametrom używanym w tagu. Ale wiemy już, że za pomocą tego tagu możemy stworzyć szeroką gamę obiektów formularzy. Czas przyjrzeć się im szczegółowo.

Obiekty zawarte w formularzu dzielą się na dwa typy - ciała do wprowadzania danych oraz przyciski inicjujące różne akcje. Najpierw zobaczmy, jak możemy utworzyć narządy wejściowe.

Jednym z najpopularniejszych obiektów formularzy jest jednowierszowe pole wejściowe. Na Listingu 1.33 widzieliśmy, że tworzy się go za pomocą parametru type z wartością tekstową. Jednocześnie dość często musimy ustawić ograniczenia dotyczące maksymalnej możliwej liczby znaków, jakie użytkownik może wpisać w to pole. To ograniczenie jest realizowane za pomocą parametru maxlength.

Wprowadzono modyfikację jednowierszowego pola do wprowadzania tekstu, które jest przeznaczone specjalnie do wprowadzania poufnych informacji, na przykład haseł. Wyświetlają wprowadzony tekst i zastępują go gwiazdkami. Takie pola wejściowe tworzone są przy użyciu następującej konstrukcji:

Używanie typu pole wyboru pozwala na tworzenie niezależnych przełączników. Są to znane kwadraty, w których jednym kliknięciem myszki możemy zaznaczać i usuwać checkboxy w postaci znaczników wyboru. W tym przypadku używany jest parametr value. Wartość tego parametru zostanie przekazana do aplikacji CGI, jeśli użytkownik zaznaczy to pole wyboru.

Możemy także tworzyć grupy przełączników, często zwanych przyciskami radiowymi. W tej grupie użytkownik może zaznaczyć i zaznaczyć tylko jeden przycisk radiowy. Każdy przełącznik jest tworzony przy użyciu znacznika z parametrem typ, któremu przypisano wartość radio. Aby przeglądarka zrozumiała, że ​​wiele przycisków radiowych należy do tej samej grupy, wartości ich parametrów nazwy muszą być takie same. Ale jednocześnie muszą mieć różne wartości parametrów wartości.

Spójrzmy na przykład zasad tworzenia i wyświetlania rozważanych organów wejściowych informacji.

Listowanie 1.34

:! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
http://www.w3.Qrg/TR/html4/strict.dtd">
,

Pole do wpisania linijki tekstu


Pole hasła


Niezależny przełącznik


Zmień grupę
Alternatywa 1


Alternatywa 2
Powiedz przyjaciołom