Formularze HTML. dr Radosław Matusik. radmat

HTML
DOWNLOAD

Wielkość: px

Rozpocząć pokaz od strony:

Download "Formularze HTML. dr Radosław Matusik. radmat"

Bogusław Kwiecień
6 lat temu
Przeglądów:

1 radmat

2 Ramy formularza: <form action="plik.php" method="post" name="formularz"> </form>

3 Grupowanie pól formularza <form action="plik.php" method="post" name="formularz"> <fieldset> </fieldset> </form>

4 Grupowanie pól formularza z tytułem <form action="plik.php" method="post" name="formularz"> <fieldset> <legend>tytuł</legend> </fieldset> </form>

5 Elementy formularza:

6 Elementy formularza: Jednolinijkowe pole tekstowe <input type= text / >

7 Elementy formularza: Jednolinijkowe pole tekstowe <input type= text / > Pole hasła <input type= password / >

8 Elementy formularza: Jednolinijkowe pole tekstowe <input type= text / > Pole hasła <input type= password / > Wielolinijkowe pole teksotwe <textarea>... </textarea>

9 Elementy formularza: Jednolinijkowe pole tekstowe <input type= text / > Pole hasła <input type= password / > Wielolinijkowe pole teksotwe <textarea>... </textarea> Pole jednokrotnego wyboru <input type= radio / >

10 Elementy formularza: Jednolinijkowe pole tekstowe <input type= text / > Pole hasła <input type= password / > Wielolinijkowe pole teksotwe <textarea>... </textarea> Pole jednokrotnego wyboru <input type= radio / > Pole wielokrotnego wyboru <input type= checkbox / >

11 Elementy formularza: Jednolinijkowe pole tekstowe <input type= text / > Pole hasła <input type= password / > Wielolinijkowe pole teksotwe <textarea>... </textarea> Pole jednokrotnego wyboru <input type= radio / > Pole wielokrotnego wyboru <input type= checkbox / > Lista rozwijana <select>

12 Atrybuty Wspólnym atrybutem dla wyżej wymienionych składowych formularza jest name - unikalna nazwa.

13 Jednolinijkowe pole tekstowe Atrybuty:

14 Jednolinijkowe pole tekstowe Atrybuty: size= n - długość pola

15 Jednolinijkowe pole tekstowe Atrybuty: size= n - długość pola maxlength= n - maksymalna liczba znaków do wpisania

16 Jednolinijkowe pole tekstowe Atrybuty: size= n - długość pola maxlength= n - maksymalna liczba znaków do wpisania value= tekst - tekst wyświetlany w polu

17 Jednolinijkowe pole tekstowe Atrybuty: size= n - długość pola maxlength= n - maksymalna liczba znaków do wpisania value= tekst - tekst wyświetlany w polu readonly= readonly - pole tylko do odczytu

18 Jednolinijkowe pole tekstowe Atrybuty: size= n - długość pola maxlength= n - maksymalna liczba znaków do wpisania value= tekst - tekst wyświetlany w polu readonly= readonly - pole tylko do odczytu disabled= disabled - zablokowanie możliwości edycji pola

19 Przykład 1 <label>podaj swoje imię:</label> <input type="text" name="imie" />

20 Wielolinijkowe pole tekstowe Atrybuty:

21 Wielolinijkowe pole tekstowe Atrybuty: cols= n - szerokość pola

22 Wielolinijkowe pole tekstowe Atrybuty: cols= n - szerokość pola rows= n - wysokość pola

23 Wielolinijkowe pole tekstowe Atrybuty: cols= n - szerokość pola rows= n - wysokość pola readonly= readonly

24 Wielolinijkowe pole tekstowe Atrybuty: cols= n - szerokość pola rows= n - wysokość pola readonly= readonly disabled= disabled

25 Przykład 2 <textarea rows="10" cols="50"> Tekst </textarea>

26 Pole jednokrotnego wyboru Atrybuty:

27 Pole jednokrotnego wyboru Atrybuty: checked= checked - domyślne zaznaczenie pola

28 Przykład 3 <label>wybierz wiek</label> <input type="radio" name="wiek" value="dwadziescia" id="wiek_0" /> <br /> <input type="radio" name="wiek" value="trzydziesci" id="wiek_1" /> <br /> <input type="radio" name="wiek" value="czterdziesci" id="wiek_2" /> 31-40

29 Pole wielokrotnego wyboru Atrybuty:

30 Pole wielokrotnego wyboru Atrybuty: checked= checked

31 Przykład 4 Uwaga! Ponieważ możemy zaznaczyć kilka odpowiedzi, to inaczej wygląda sposób przesyłania danych z formularza do skryptu PHP. Jego obsługą, tj. wyświetleniem wszystkich zaznaczonych pól zajmiemy się w dalszej części kursu, gdy poznamy tablice i pętle.

32 Przykład 4 Uwaga! Ponieważ możemy zaznaczyć kilka odpowiedzi, to inaczej wygląda sposób przesyłania danych z formularza do skryptu PHP. Jego obsługą, tj. wyświetleniem wszystkich zaznaczonych pól zajmiemy się w dalszej części kursu, gdy poznamy tablice i pętle. <label>wybierz swoje hobby</label> <input type="checkbox" name="hobby[]" value="sport" id="checkboxgroup1_0" /> sport <br /> <input type="checkbox" name="hobby[]" value="muzyka" id="checkboxgroup1_1" /> muzyka <br /> <input type="checkbox" name="hobby[]" value="gotowanie" id="checkboxgroup1_2" /> gotowanie

33 Lista rozwijana Atrybuty:

34 Lista rozwijana Atrybuty: selected= selected - domyślne zaznaczenie

35 Lista rozwijana Atrybuty: selected= selected - domyślne zaznaczenie size= n - liczba widocznych wierszy

36 Lista rozwijana Atrybuty: selected= selected - domyślne zaznaczenie size= n - liczba widocznych wierszy multiple= multiple - umożliwia zaznaczenie kilku pozycji

37 Przykład 5 <label>wybierz województwo:</label> <select name="wojewodztwo" size="1"> <option value="lodzkie">łódzkie</option> <option value="mazowieckie">mazowieckie</option> <option value="slaskie">śląskie</option> </select>

38 Lista rozwijana z grupowaniem <select id="opcje" name="opcje" size="4"> <optgroup label="dni wolne"> <option>sobota</option> <option>niedziela</option> </optgroup> <optgroup label="dni robocze"> <option>poniedziałek</option> <option>wtorek</option> <option>środa</option> <option>czwartek</option> <option>piątek</option> </optgroup> </select>

39 Przycisk wysyłający dane <input type="submit" name="wyslij" value="prześlij dane" />

40 Przycisk graficzny wysyłający dane Aby wstawić do formularza przycisk z własną grafiką, należy napisać: <input type="image" src="grafika.gif" alt="wyślij">

41 Przycisk czyszczący formularz <input type="reset" name="wyczysc" value="wyczyść formularz" />

42 Przykład 6 Utworzymy teraz na stronie WWW formularz, który będzie się składał z jednolinijkowego pola tekstowego, do którego użytkownik będzie mógł wprowadzać informację, a następnie wyświetlimy tę informację. Obsługę wyświetlania zapewni nam skrypt PHP.

43 Plik index.html <body> </body>

44 Plik index.html <body> <form action="imie.php" method="post" name="formularz"> </form> </body>

45 Plik index.html <body> <form action="imie.php" method="post" name="formularz"> <label for="imie">imię</label> </form> </body>

46 Plik index.html <body> <form action="imie.php" method="post" name="formularz"> <label for="imie">imię</label> <input type="text" name="imie" /> </form> </body>

47 Plik index.html <body> <form action="imie.php" method="post" name="formularz"> <label for="imie">imię</label> <input type="text" name="imie" /> <input type="submit" name="wyslij" value="prześlij dane" /> </form> </body>

48 Plik imie.php <html> <body> Dziękuję Ci <?php echo $_POST[ imie ];?> za wypełnienie formularza. </body> </html>

49 Zmienne Zmienne w PHP (podobnie jak w innych językach programowania) przechowują różne wartości (m.in. liczby rzeczywiste, całkowite, czy ciągi znaków). W PHP nie ma konieczności deklarowania zmiennych. Można ich używać od miejsca, w którym zostały umieszczone w kodzie. Zmienną tworzy znak dolara i nazwa, np. $zmienna.

50 Zmienne Zmienne w PHP (podobnie jak w innych językach programowania) przechowują różne wartości (m.in. liczby rzeczywiste, całkowite, czy ciągi znaków). W PHP nie ma konieczności deklarowania zmiennych. Można ich używać od miejsca, w którym zostały umieszczone w kodzie. Zmienną tworzy znak dolara i nazwa, np. $zmienna. W celu ułatwienia sobie pracy warto pobierane dane z formularzy przypisywać do zmiennych, np. $zmienna=$ POST[ imie ].

Podobne dokumenty

Formularze w PHP dla początkujących

Instrukcja numer 07 Formularze w PHP dla początkujących Zaawansowane techniki tworzenie stron WWW Bazy danych w PHP dla początkujących Formularze stworzone w HTML mogą służyć jako metoda pobierania informacji