Powrót do strony głównej.

Powrót do moje lekcje programowania.

Sekcja 9: HTML|Formularze - Podstawy

Spis treści:

47. Czym jest formularz oraz input? Jak stworzyć formularz z loginem i hasłem? - 14.11.2022

Spis treści.
lekcja 47 na Udemy
Formularz - dokument z polami (rubrykami) do wypełniania

in - w, put - położyć (wejście)

Login:
Hasło:
                            
<form>
    Login: <input type="text"><br>
    Hasło: <input type="password"><br>
</form>
                            
                        

48. Akcja wysyłania formularza. Atrybuty: action, name oraz przycisk submit - 14.11.2022

Spis treści.
lekcja 48 na Udemy
Atrybut: name

action

method=GET/POST

Login:
Hasło:
                            
                                
<form ation="login.php" method="POST">
    Login : <input type="text" name="login"><br>
    Hasło: <input type="password" name="pw"><br>

    <input type="submit" value="Zaloguj się">

</form>

                            
                        

49. Pole radio | etykiety (label) | fieldset - 14.11.2022

Spis treści.
lekcja 49 na Udemy
  • Pole radio - radio - Ile masz lat?
  • Pole wyboru - checkbox - Jakie jest Twoje hobby?
  • fieldset - zbiór(zestaw) pól
  • legend - opis dla fieldset
  • label - etykieta
  • Atrybut checked

    Ile masz lat?


                                
    <form action="ankieta.php">
        <fieldset>
            <legend>Ile masz lat?</legend>
            <input type="radio" name="kategoria_wiekowa" id="kategoria_wiekowa1" value="7-18"><label for="kategoria_wiekowa1">7-18</label> <br>
            <input type="radio" name="kategoria_wiekowa" id="kategoria_wiekowa2" value="19-29"><label for="kategoria_wiekowa2">19-29</label><br>
            <input type="radio" name="kategoria_wiekowa" id="kategoria_wiekowa3" value="30-39"><label for="kategoria_wiekowa3">30-39</label><br>
        </fieldset>
    
        <input type="submit" value="Wyślij">
    </form>
                                
                            

    50. Pole checkbox

    Spis treści.
    lekcja 50 na Udemy - 15.11.2022
    Jakie jest Twoje hobby?
                                
    <form action="ankieta.php">
    
        <fieldset>
            <legend>Jakie jest Twoje hobby></legend>
    
            <input type="checkbox" name="hobby[]" id="plywanie" value="plywanie"><label for="plywanie">pływanie</label>
            <input type="checkbox" name="hobby[]" id="progranowanie" value="programowanie"><label for="programowanie">programowanie</label>
            <input type="checkbox" name="hobby[]" id="gry_komputerowe" value="gry_komputerowe"><label for="gry_komputerowe">gry komputerowe</label>
        </fieldset>
    
        <input type="submit" value="Wyślij">
    </form>
                                
                            

    51. Najczęściej używane atrybuty w formularzach - 16.11.2022

    Spis treści.
    lekcja 51 na Udemy
    Ilość jednostek: szt.
    Hasło:
    Nr domu:
    Nr mieszkania:
                                
    <form action="ankieta.php">
    Ilość jednostek: <input type="text" autocomplete="off" size="2" maxlength="1" placeholder="1-9" value="1" autofocus> szt. <br>
    Hasło: <input type="password"> <br>
    Nr domu: <input type="text" value="92" required> <br>
    Nr mieszkania: <input type="text"> <br>
    
    <input type="submit" value="Wyślij">
    </form>
                                
                            

    52. ĆWICZENIE: Formularz kontaktowy - 16.11.2022

    Spis treści.
    lekcja 52 na Udemy
    Stwórz formularz kontaktowy na stronie.
    Zapytaj się o:
    1) e-mail
    2) imię
    3) temat
    4) treść maila
    Poszukaj w Internecie informacji na temat: input type="email" oraz "textarea".

    Skontaktuj się z nami E-mail:
    Imię:

    Temat:

    Treść maila:


                                
                                    
    <form action="send_mail.php" method="post">
        <fieldset>
            <legend>Skontaktuj się z nami</legend>
            
            E-mail: <input type="email" name="email" id="email" placeholder="@" required><br>
            Imię: <input type="text" name="imię" required><br><br>
            Temat: <input type="text" name="temat" required><br><br>
    
            Temat maila: <br>
                <textarea name= email.content" id="email_content" cols=30 rows="10" placeholder="Jak możemy Ci pomóc?" required></textarea>
    
                <br><br>
                <input type="submit" value="Wyślij">
        </fieldset>
    </form>
    
                                
                            

    53. Pobieranie daty i czasu od użytkownika - 15.11.2022

    Spis treści.
    lekcja 53 na Udemy



                                
    <form>
        <input type="date" min="2020-11-24" max="2022-12-31"><br>
        <input type="time"><br>
    </form><br>