Perancangan Web Pertemuan IV

Presentasi berjudul: "Perancangan Web Pertemuan IV"— Transcript presentasi:

1 Perancangan Web Pertemuan IV
Tim FT Elektro UHAMKA

2 HTML Form

3 HTML Form Elemen HTML yang digunakan untuk menerima bermacam-macam masukan (input) dari pengguna web. Contoh :

4 Form Tag Sebuah tag yang membungkus elemen-elemen input di dalamnya dan berfungsi mengirim data input ke server.

5 Elemen Input Form Macam‐macam komponen input : Textfield Password
Checkbox Radiobutton

6 Elemen Input Form Macam‐macam komponen input (lanjutan) : Listbox
Combobox Text Area File

7 Elemen Input Text Field
Digunakan untuk memasukan huruf, angka, karakter, dll ke dalam sebuah form. Tag : <input type="text" />

8 Elemen Input Password Digunakan untuk menyembunyikan karakter masukan.
Tag : <input type=“password" />

9 Elemen Input Checkbox Digunakan untuk melakukan satu atau lebih dari banyak pemilihan data. Tag : <input type=“checkbox" />

10 Elemen Input Radio Button
Digunakan untuk melakukan satu pemilihan diantara 2 atau lebih data. Tag : <input type=“radio" />

11 Elemen Input Listbox Digunakan untuk melakukan satu atau lebih pemilihan diantara 2 atau lebih data menggunakan listbox. Tag : <select size=“List_Rows"><option></option></select>

12 Elemen Input Combo box Digunakan untuk melakukan satu pemilihan diantara 2 atau lebih data menggunakan drop-down. Tag : <select><option></option></select>

13 Elemen Input Text Area Sebuah area yang dapat menampung teks yang tidak terbatas ukurannya. Tag : <textarea cols=“x" rows=“y"></textarea>

14 Elemen Input File Digunakan untuk memilih atau membuka file.
Tag : <input type="file">

15 Atribut Form Atribut Form :
Action : Lokasi script yang memproses data dari form. Enctype : Mendefinisikan cara encoding data sebelum dikirimkan. Biasanya digunakan jika ingin meng-upload file. Method : Metode pengiriman data. GET : Data dikirimkan bersama URL. POST : Data dikirimkan terpisah dari URL.

16 Elemen Tombol : Submit Tombol yang berfungsi secara otomatis mengirim data yang di-input-kan di dalam form ke halaman ‘action’. Tag : <input type="submit“>

17 Elemen Tombol : Reset Tombol yang berfungsi mengembalikan “value” dari semua elemen di form ke “value” semula saat halaman dibuka. Tag : <input type=“reset“>

18 Tugas

19 Halaman depan Login_Form.html

20

21

22 Halaman mahasiswa mahasiswa.html

23

24

25

26

27