Dokumen ini membahas tentang penggunaan form HTML untuk membuat formulir pendaftaran sekolah merdeka. Terdapat penjelasan mengenai berbagai jenis kontrol form seperti text input, checkbox, radio button, dropdown, submit dan reset button. Disertai contoh kode HTML untuk mengimplementasikan masing-masing kontrol form. Di akhir diberikan tugas membuat portal sekolah merdeka menggunakan form HTML.

1. FAKULTAS SAINS DAN TEKNOLOGI
PRODI TEKNOLOGI INFORMASI
UNIVERSITAS ISLAM NEGERI WALISONGO SEMARANG
www.herymustofa.net
TIF-6329
PEMROGRAMAN WEB
P4 – Form HTML

2. Universitas Islam Riset Terdepan Berbasis pada Kesatuan Ilmu Pengetahuan untuk Kemanusiaan dan Peradaban pada Tahun 2038
- 2 -
www.herymustofa.netType Form
Text Input Controls
Checkboxes Controls
Radio Box Controls
File Select boxes
Hidden Controls
Submit and Reset Button

3. Universitas Islam Riset Terdepan Berbasis pada Kesatuan Ilmu Pengetahuan untuk Kemanusiaan dan Peradaban pada Tahun 2038
- 3 -
www.herymustofa.net
<form action="" method="GET">
.....
.....
</form>
Tentukan Method dan Action Form

4. Universitas Islam Riset Terdepan Berbasis pada Kesatuan Ilmu Pengetahuan untuk Kemanusiaan dan Peradaban pada Tahun 2038
- 4 -
www.herymustofa.netInput
<input type="text" name=nim-txt>
<input type=“password" name=password>
<textarea rows = "5" cols = "50" name =
"description">
masukan diskripsi disini
</textarea>

5. Universitas Islam Riset Terdepan Berbasis pada Kesatuan Ilmu Pengetahuan untuk Kemanusiaan dan Peradaban pada Tahun 2038
- 5 -
www.herymustofa.netInput
<form action=“” method=“POST”
<input type="text" name=nim-txt>
<input type=“password" name=password>
</form> D:WEBTIp3-latihan1.html

6. Universitas Islam Riset Terdepan Berbasis pada Kesatuan Ilmu Pengetahuan untuk Kemanusiaan dan Peradaban pada Tahun 2038
- 6 -
www.herymustofa.netText, Password & Textarea
<input type="text" name=nim-txt>
<input type=“password" name=password>
<textarea rows = "5" cols = "50" name =
"description">
masukan diskripsi disini
</textarea>

7. Universitas Islam Riset Terdepan Berbasis pada Kesatuan Ilmu Pengetahuan untuk Kemanusiaan dan Peradaban pada Tahun 2038
- 7 -
www.herymustofa.netCheckbox
<input type="checkbox" name="ukm-cb" value="unic"> UNIC
<input type="checkbox" name="ukm-cb" value="bahasa"> Bahasa
<input type="checkbox" name="ukm-cb" value="karate"> Karate

8. Universitas Islam Riset Terdepan Berbasis pada Kesatuan Ilmu Pengetahuan untuk Kemanusiaan dan Peradaban pada Tahun 2038
- 8 -
www.herymustofa.netRadio Button
<input type="radio" name="gender-rad" value="pria">Pria
<input type="radio" name="gender-rad" value="Wanita">Wanita

9. Universitas Islam Riset Terdepan Berbasis pada Kesatuan Ilmu Pengetahuan untuk Kemanusiaan dan Peradaban pada Tahun 2038
- 9 -
www.herymustofa.netDrop Down
<select name = "fakultas-dd">
<option value = "filkom-dd" selected>FILKOM</option>
<option value = "hukum-dd">HUKUM</option>
</select>

10. Universitas Islam Riset Terdepan Berbasis pada Kesatuan Ilmu Pengetahuan untuk Kemanusiaan dan Peradaban pada Tahun 2038
- 10 -
www.herymustofa.netInput
<form action=“” method=“POST”
<input type="text" name=nim-txt>
<input type=“password" name=password>
</form> D:WEBTIp3-latihan1.html

11. Universitas Islam Riset Terdepan Berbasis pada Kesatuan Ilmu Pengetahuan untuk Kemanusiaan dan Peradaban pada Tahun 2038
- 11 -
www.herymustofa.netSubmit dan Reset
<input type="submit" name = "submit-bt" value="Submit">
<input type = "reset" name = "reset-bt" value = "Reset" />

12. Universitas Islam Riset Terdepan Berbasis pada Kesatuan Ilmu Pengetahuan untuk Kemanusiaan dan Peradaban pada Tahun 2038
- 12 -
www.herymustofa.net
1. Buat portal sekolah merdeka menggunakan HTML dan Form Pendaftaran HTML.
2. Capture print screen hasil dan source code HTML
3. Buat dalam bentuk hardcopy
4. Maksimalpengumpulan minggu depan
Tugas 1

13. Universitas Islam Riset Terdepan Berbasis pada Kesatuan Ilmu Pengetahuan untuk Kemanusiaan dan Peradaban pada Tahun 2038
- 13 -
www.herymustofa.net

14. Universitas Islam Riset Terdepan Berbasis pada Kesatuan Ilmu Pengetahuan untuk Kemanusiaan dan Peradaban pada Tahun 2038
- 14 -
www.herymustofa.net