Wysyłanie danych i wprowadzanie tekstu - HTML

in #polish6 years ago

Powoli do przodu idziemy z formularzami w HTMLu. Czas zająć się ich tworzeniem.

Button wysyłający dane

"Wyślij post", "Szukaj w Google", "Usuń konto" to parę z popularnych przycisków dostępnych w internecie. Ich uruchomienie wykonuje pewne akcje, które zostały zaprogramowane przez programistów w np. PHP albo Javascript. Często jednak jest potrzebny (niezbędny?) przycisk, który wyśle wszystkie dane zawarte w formularzu do serwera ... i to robi właśnie wspomniany przycisk.

Przykładowy kod:

<form>
<button type="submit">Wyslij formularz</button>
</form>

Oczywiście przycisk działa w konkretnym formularzu - tak więc form definiuje zasięg formatki. Znacznik button wytwarza przycisk z typem "submit" (wyślij). Sam przycisk ma nazwę "Wyslij formularz".

Oczywiście w naszym przypadku przycisk nie spełnia żadnej funkcji, chociaż jego naciśnięcie przeładowuje stronę i w ten sposób "informuje", że formularz działa.

Input - text

Czasem potrzebujemy wpisać jakąś wartość do strony internetowej. Powiedzmy, że w logowaniu będzie to login. Musimy go jakoś wpisać i do tego służy pole input z typem "text".

<form>
<input type="text" name="imie" placeholder="Podaj swoje imie">
<button type="submit">Wyslij formularz</button>
</form>

Mamy więc tak. Input jako znacznik przyjmowania danych o typie "text" - czyli wpisujemy tutaj dane z klawiatury. To co wpiszemy zostanie przypisane do zmiennej imie (parametr name), a placeholder to informacja jaka się wyświetla gdy nic nie wpiszemy (czyli Podaj swoje imie).

image.png

image.png

Jeśli wpiszemy dane (najlepiej) i naciśniemy przycisk "Wyslij formularz" to zmieni nam się adres w przeglądarce (bo nie podając metody - automatycznie jest używany GET).

image.png

Na razie to tyle na dziś, popróbujcie stworzenie prostego formularza w domu ;) Do następnego!

Coin Marketplace

STEEM 0.29
TRX 0.12
JST 0.032
BTC 63330.76
ETH 3090.95
USDT 1.00
SBD 3.80