Assalaamu’alaikum wrwb…
Selamat berjumpa lagi bersama BangHaji DotCom 🙂 Sudah hampir 3 bulan ya saya tidak menulis, maklum, lagi sok sibuk 😎 Oke, sebelumnya saya mau menyampaikan Selamat Idul Fitri, mohon maaf lahir dan batin.
Ya, kita langsung saja. Kali ini kita membahas tentang bagaimana membuat formulir pada halaman HTML. Tentunya kita sudah sangat sering menemukan bahkan berinteraksi dengan yang namanya formulir. Lihat ke bawah saja, maka Anda akan menemukan formulir. Iya, untuk menulis komentar 🙂
Ada beberapa jenis isian yang ada di dalam formulir. Diantaranya inputan teks, pilihan yang bulat-bulat 😆 (nanti kita bahas namanya), ada juga centangan (jangan salah baca, jadi cantengan 😀 ), ada lagi kolom isian yang panjang kali lebar, pilihan yang muncul ke bawah. Dan yang terpenting ada tombol.
Selingan, sebaiknya baca-baca kembali beberapa tulisan berikut agar nanti semakin mudah memahami kode-kode yang akan kita bahas:
Oke, lanjut.
Formulir dengan berbagai isiannya yang bermacam-macam harus diletakkan dalam tag khusus untuk formulir yaitu harus berada dalam <form> dan </form>. Kemudian pada tag tersebut ada beberapa atribut yang mendukung fungsi dari formulir. Diantaranya adalah method="?" yang diisi dengan get atau post, kemudian action="?" yang diisi dengan nama file tujuan pengiriman data-data isian. 2 atribut tadi paling banyak bahkan harus ada saat membuat formulir. Sebetulnya ada 1 lagi yang juga sering digunakan yaitu enctype="multipart/form-data" untuk menangani pengiriman berupa file.
input
Kita mulai dengan inputan ya. Ada banyak sekali jenisnya dan tidak semuanya kita bahas. Nanti dicoba-coba sendiri saja ya 🙂 . Tag yang digunakan adalah <input type="?">. Coba kita lihat, apa saja jenis yang bisa digunakan untuk mengganti tanda tanya (?): text, password, radio, checkbox, hidden, color, file, range, number, email, url, date, time, search dan banyak lagi 😆
Oh iya lupa, ada tambahan atribut di dalam semua tag input agar berfungsi normal saat pengiriman data yaitu atribut name="?". Nah, name ini WAJIB ADA dan WAJIB BERBEDA di antara semua nama untuk elemen isian dalam formulir, kecuali untuk isian yang sejenis. Lalu ada lagi tambahan yang tidak wajib seperti placeholder="?" untuk menjelaskan isiannya apa dan value="?" jika ingin terisi duluan.
Kita coba ya, silakan dibuat sebuah file baru, beri nama 47-html-formulir-input.html. Ayo, masih ingat ga caranya? Silakan berkenalan lagi dengan HTML jika lupa 😉 . Selanjutnya ketik kode berikut ini, kemudian simpan dan coba dijalankan.
<!DOCTYPE html>
<html>
<head>
<title>Formulir Input</title>
</head>
<body>
<h2>Contoh Formulir</h2>
<p>Menggunakan tag input</p>
<form>
Nama (text):<br>
<input type="text" name="nama" placeholder="Nama lengkap"><br><br>
Jenis Kelamin (radio):<br>
<input type="radio" name="jenis" value="L">Laki-laki<br>
<input type="radio" name="jenis" value="P">Perempuan<br><br>
Hobi (checkbox):<br>
<input type="checkbox" name="hobi[]" value="Menyanyi">Menyanyi<br>
<input type="checkbox" name="hobi[]" value="Main Catur">Main Catur<br>
<input type="checkbox" name="hobi[]" value="Memancing">Memancing<br>
<input type="checkbox" name="hobi[]" value="Main Game">Main Game<br><br>
Sandi (password):<br>
<input type="password" name="password" placeholder="Masukkan sandi"><br><br>
Input tersembunyi (hidden):<br>
<input type="hidden" name="tidak_ada" value="ini input hidden"><br><br>
Upload (file):<br>
<input type="file" name="dokumen"><br><br>
Isian angka (number):<br>
<input type="number" name="angka"><br><br>
<input type="submit" name="kirim" value="Kirim">
<input type="reset" name="reset" value="Bersihkan">
</form>
</body>
</html>
Setelah dijalankan hasilnya kira-kira seperti ini ya.
Silakan diisi dan dipilih-pilih, tekan tombolnya 😎
Ayo kita lanjutkan, lihat halaman sebelah ya 😀
waaahhh artikelnya sangat bagus dan bermanfaat… terimakasih yaa sudah membuat artikel ini. karena artikel ini saya sudah tau cara membuat form pada html.. semoga kedepannya dapat membuat artikel lainnya yang berhubungan dengan html, pastinya sangat berguna bagi saya dan temen temen yang sedang mempelajari pemrograman web .Perkenalkan nama saya MEIREZA SITI ASSYIFA.
Terimakasih artikel yang menarik kak, dari beberapa artikel yang sempat saya kunjungi dan saya baca masih banyak penulisan, bahasa, dan penyajian dalam menjelaskan suatu materi yang rumit untuk saya pahami.
Perkenalkan nama saya,ernita resva julina
wauuuu min makasih artikelnya yang sangat bermanfaat buat saya dan temen-temen lainnya karena artikelnya sangat bagus bagi saya yang baru belajar from html.semogakedepannya admin semakin sukses dan semakin membagikan ilmunya kepada saya dan teman-teman lainnya.perkenalkan nama saya adalah PEGI ANGGRAINI dari kampus STMIK ATMA LUHUR
Terima kasih untuk informasi yang telah diberikan melalui artikel ini, ini sangat berguna bagi saya yang baru belajar untuk membuat form pada html
semoga artikel ini bermanfaat untuk yang lain
perkenalkan nama saya Erie Yunantari dai STMIK Atma Luhur jangan lupa kunjungi website kampus kami
uhhhh makasih banget kak artikel nya bagus seklai saya yang baru belajar jadi mudah mengeri karna ada penjelasan dan juga contoh nya Into Saya Rellyta agustine jangan lupa mampr ke website kampus saya ya kakhttps://www.atmaluhur.ac.id/
Terimah kasih atas artikel diatas sedikit tolong perjelasan diperbanyak lagi agar lebih muda dimengerti perkenalkan nama saya claudio khelvin
Erggg
Terima kasih banghaji,atas artikelnya.membantu banget dalam pengerjaan coding pemrograman web html pada form/formulir saya,sebelum nya saya sangat bingung gmna mengerjakaan nya,ternyata gmpng banget ya hehe:).Semoga artikelnya dapat membatu dan bermanfaat bagi orang lain banghaji,dan hajinya nambah lagi Aamiin
Perkenalkan Nama Saya Dhita Heru Pambudi.
makasih yaa
makasih atas artikel nya mudah di pahami sayah udah cobah dan berhasil makasih buat atminya berkarya trus min #nama famzi abel p #nim1922500207 #si2k #matkul DPW #https://www.atmaluhur.ac.id/
Selamat pagi kak,terimakasih atas ilmu nya sangat mudah di pahami,semoga bisa memberi info” lain nya ,sukses selalu.perkenalkan nama saya dita rahmanda,nim 1922500076 dari kelompok si2j
Selamat malam.kak,artikel ny sangat membantu kita,di tunggu artikel selanjutnya nya kak,semoga berkarya terus kak dalam membuat artikel nya , perkenalkan nama saya Muhamad Rafi-1922500144
Thanks ya kak atas pembelajaran yang kakak post. Sangat berguna untuk mempermudah dan membantu tugas kuliah saya. Jangan berhenti memposting hal yang bermanfaat kak. Semangat. Perkenalkan nim saya 1922500072, nama amirah hazwani, kelompok si2j
Terima kasih kak artikel nya bagus sekali dan sangat berguna bagi saya yang baru belajar, semoga kedepan nya dapat membuat artikel positif lain nya kak, terima kasih.
Perkenalkan saya Elvin Abel, nim 1922500134, SI2K
Makasih kak, pengerjaan coding pemrograman web html pada form/formulir sebelum nya saya sangat bingung gmna mengerjakaan nya,ternyata gmpng banget ya hehe:).Semoga artikelnya dapat membatu dan bermanfaat bagi orang lain, semoga juga lebih maju lagi kak, perkenalkan nama saya Andry Saputra Nim 1922500168 kelompok SI2k
Terima kasih kak atas artikelnya, sangat membantu tugas saya dalam memahami pembuatan html formulir, trus upload artikel yg lebih beragam kedepanya agar semakin lengkap, sekian mohon maaf jika ad komenyar saya yg tidak berkenan di hati kakak. 🙂
Nama :Vallerey Oscar
Nim. :1922500128
Kelompok :SI2K
Terima kasih kak,atas artikelnya mudah dipahami dan dimengerti untuk kita pelajari
Nama:inzaghi saputra
Nim:1922500112
Kelompok:si2k
Terima kasih atas artikel nya mudah dimengerti, terus berkarya ya kak #nama Marganda Sinabutar#nim1922500147#si2k #matkul DPW
terimakasih kak bermanfaat sekali semoga bermanfaat bagi saya dan yang lain lain jg ya dan jangan pernah menyera menebarkan kebaikan sagat berguna sekali saya tunggu ya tutorial atau artikel selanjut nya NIM:1922500200 NAMA:Muhammad Nugis Cesarianto KELOMPOK:SI 2 K
jangan lupa kunjingi jg website kami salam budi luhur
Malam kak, terima kasih atas artikel yang udah kakak share ini sangat berguna sekali untuk saya dan semuanya kak, semoga kakak selalu share yang begini ya. perkenalkan nama saya SADAM HUSEIN, nim 1922500158, kelompok si2k
Hal ini sangat baik karena dapat menjadi pelajaran tambahan bagi para mahasiswa Indonesia seperti saya yang mengambil bidang studi sistem informasi untuk memperbaiki dan meningkatkan kualitas dalam materi perkuliahan design pemrograman web untuk membuat HTML
Nurfatonah-2022500133 kelompok SI2K
Terima kasih…
Thanks ya kak atas pembelajaran yang kakak post. Cukup mudah dipahami
Oh iya kapan-kapan mampir dikampus saya…
Nama : Naufal Fahmi
2022500011
Terima kasih atas kunjungannya…
Artikel ini sangat membantu saya dlm belajar memahami dan membuat sebuah formulir dgn html, terimakasih kak, untuk admin sukses terus dlm membuat artikel lainnya yg bermanfaat bagi pembaca lainnya,
Saya Fauziah Syafarina
Terima kasih sudah berkunjung…
hallo kak
terimakasih artikelnya sangat bermanfaat dan juga mengajarkan saya cara membuat form pada html, semangat terus kak untuk menulis artikel nya supaya bisa mempermudah kami dalam belajar apalagi untuk saya yang baru belajar, saya harap admin bisa menambah artikel yang lebih menarik lagi dari ini.
Perkenalkan nama saya (Tasya marisca 2022500137) dan jangan lupa kunjungi web kampus saya…
Terima kasih atas kunjungannya…
terimakasih kak artikel nya sangat bermanfaat bagi saya.dengan adanya artikel ini saya bisa mempelajari membuat form pada HTML.
semangat terus kak untuk membuat artikel-artikel yang bermanfaat.
perkenalkan saya Cindy Carolin, teimakasih
Terima kasih kembali..
Terimakasih kak berkat artikel kakak saya mulai mengerti sedikit banyak tentang membuat formulir pada html, artikel yang kakak buat cukup jelas dan mudah dimengerti untuk pemula seperti saya, Terimakasih atas kerjasamanya dalam hal berbagi ilmu yang bermanfaat ya kak.
Salam kenal saya Sutia Dinarti Nim: 2022500146
Jangan lupa kunjungi website kampus kami
Terima kasih ya…
sangat membantu