Cara menggunakan elemen pada formulir html

Untuk beberapa kebutuhan tertentu, Anda tentu memerlukan penggunaan form pada website Anda seperti form survei, form biodata, form pendaftaran, form login, dan lain-lain.

Formulir memungkinkan pengguna berinteraksi dengan teks, grafik, atau hal lain yang ditampilkan di browser. Form tersebut memiliki beberapa jenis elemen input seperti text, radio, submit dan lain-lain. Sebelumnya kita telah membahas tentang input type text element. Nah pada pembahasan kali ini saya akan menjelaskan penggunaan elemen input seperti password dan submit pada form HTML. Untuk lebih jelasnya mari kita simak penjelasannya dibawah ini

Jenis elemen masukan = ”kata sandi”

Elemen input tipe kata sandi digunakan untuk membuat kotak teks tetapi semua teks tertulis ditampilkan dalam karakter lain seperti "*" untuk memberikan keamanan bagi semua data yang dimasukkan.

Jenis elemen masukan = ”kirim”

Elemen submit type input digunakan untuk membuat tombol dimana tombol tersebut berguna untuk mengirimkan data form ke server untuk diproses. Adapun sintaks elemen jenis ini secara umum yaitu

<input type ="submit" value="Kirim Data">

Untuk memperjelas sintaks di atas, saya akan menjelaskan kembali penggunaan atribut value yang sudah dibahas pada tutorial sebelumnya. Atribut value pada elemen input type submit berupa button digunakan untuk menentukan teks yang tertulis pada button tersebut, jika tidak menuliskan atribut value tidak apa-apa

Agar Anda lebih memahami penggunaan kedua jenis elemen input di atas, berikut adalah contoh penulisan kode dan penggunaan kedua jenis elemen input dalam HTML

<!DOCTYPE html>
<html>
 <head>
  <title>Penggunaan Tipe Input Password dan Submit di HTML Forms</title>
 </head>
 <body>
  <h4>Isilah formulir dibawah ini dengan baik dan benar ! </h4>
  <hr>
   <form action="proses_input.php" method="get">
    Nama Depan : <input type="text" name="nama_depan"> <br><br>
    Nama Belakang : <input type="text" name="nama_belakang"> <br><br>
    Email : <input type="text" name="email"> <br><br>
    Password : <input type="password" name ="password" maxlength="20"> <br><br>
    <input type="submit" value="SUBMIT">
  </form>
 </body>
</html>
_

Setelah kode diatas dijalankan pada browser maka akan muncul seperti gambar dibawah ini

Cara menggunakan elemen pada formulir html
Cara menggunakan elemen pada formulir html

Nah, gambar diatas adalah contoh form yang belum terisi (masih kosong). Agar dapat melihat perbedaan tampilan data pada text box password, lihat contoh gambar dibawah ini

Cara menggunakan elemen pada formulir html
Cara menggunakan elemen pada formulir html

Nah, apa yang akan terjadi ketika Anda mengklik tombol kirim? . Pada contoh di atas, data pada form akan diproses oleh file process_input. php (Catatan. file proses_input. php adalah file kosong karena hanya sebagai contoh). Berikut adalah contoh gambar address bar halaman web setelah tombol submit diklik

Cara menggunakan elemen pada formulir html
Cara menggunakan elemen pada formulir html

Nah, sekarang mari kita lihat address bar pada gambar di atas. Sebelumnya, kita membuat form menggunakan metode GET. Metode GET akan menampilkan form data yang akan dikirimkan pada akhir URL yang kemudian akan ditampung oleh action

Cara menggunakan elemen pada formulir html
Cara menggunakan elemen pada formulir html

Jadi semua data yang Anda masukkan di formulir akan ditampilkan di bilah alamat setelah URL seperti yang ditunjukkan pada gambar bilah alamat di atas. Sekian materi tentang penggunaan input type password dan input type submit element pada form HTML. Semoga bermanfaat

Bagian 27. Cara Membuat Bentuk Sederhana

Bagian 29. Atribut Readonly, Disabled, dan Target

Editor. Muhammad Zakaria

Download berbagai jenis aplikasi terbaru mulai dari windows, aplikasi android, driver dan sistem operasi gratis hanya di Nesabamedia. com

Form adalah salah satu elemen dalam HTML yang digunakan untuk menerima masukan dari pengunjung. Melalui form pengunjung halaman web dapat berinteraksi dengan web. Pengunjung dapat memasukkan data melalui elemen input seperti textfield, checkbox, radio button, textarea, submit button, dropdown dan lain-lain. Selain itu, pengunjung juga dapat memilih data menggunakan elemen daftar pilih atau dengan kata lain combo box atau daftar drop-down. Formulir membuat halaman web menjadi web yang interaktif dan dinamis, karena formulir adalah satu-satunya cara bagi pengembang situs web untuk mendapatkan informasi dari pengguna.

Berikut adalah perintah dasar Formulir


elemen masukan


Ada dua atribut yang digunakan pada elemen form yaitu method dan action

Metode yang berfungsi sebagai pengiriman data pada server dengan cara menuju tujuan yaitu

- Gerbang. kirim data ke server dengan menempatkan data di akhir URL yang ditunjukkan

- Posting. mengirim data secara terpisah

Bedanya, jika atribut method kita isi dengan get (dimana ini adalah nilai defaultnya jika tidak kita tuliskan) maka isian form akan terlihat di url browser. Metode get ini biasanya digunakan untuk permintaan pencarian. Metode posting biasanya digunakan untuk data yang lebih sensitif seperti kata sandi atau pendaftaran pengguna. Data hasil formulir tidak akan terlihat di browser


Action yang berfungsi untuk menentukan lokasi script yang akan mengolah data dari form

Struktur dasar formulir akan terlihat sebagai berikut


mengisi formulir



Masukkan elemen pada Formulir

Elemen yang paling penting dalam form adalah elemen input. Elemen ini memungkinkan pengunjung untuk memasukkan data melalui halaman form yang kemudian data tersebut akan dikirim ke server. Terdapat banyak elemen input pada form tersebut, yang dapat digunakan oleh pengguna untuk mengisi data dengan tipe yang berbeda. Berikut ini akan saya bahas masing-masing elemen input form, beserta cara membuatnya

1.       Bidang Teks

Elemen yang digunakan untuk memasukkan teks dalam satu baris. Lebar karakter default adalah 20 karakter

Menulis. < jenis input = ”teks” />

Ini sebuah contoh

First name :

nama keluarga. < tipe input = "teks" nama = "nama belakang" />


2.       Bidang Kata Sandi

Untuk memasukkan data baris teks dengan format ciphertext/password. Dengan karakter yang disamarkan dengan lingkaran atau tanda "*".

Menulis. < jenis input = ”kata sandi” />

Ini sebuah contoh

Password :


3.       Tombol Pilihan

Radio button digunakan untuk dapat memilih salah satu pilihan. Contoh jenis kelamin (pria atau wanita)

Penulisannya :  Radio Button

Ini sebuah contoh

Jenis kelamin Male

Perempuan


4.       Area Teks

Digunakan sebagai input kontrol formulir untuk memasukkan lebih dari satu baris teks. Elemen ini memiliki atribut yaitu name, cols, dan rows

Seperti yang dijelaskan di bawah ini

Nama = nama variabel yang dikirim ke aplikasi

Baris                    = panjang baris dalam karakter

Cols                       = tinggi kotak

Penulisannya :

Nama=”nama”

Col =”angka”

Baris=”angka”

...........


Ini sebuah contoh

Alamat :



5.       Kotak Centang

Check Box digunakan untuk dapat memilih lebih dari satu pilihan

Penulisannya: Check Box

Ini sebuah contoh

Hobi

Baca Buku

seni

Olahraga

Jalan Jalan

6.       Pilih Daftar

Digunakan untuk menampilkan daftar pilihan dalam bentuk drop-down list

Tulisan

......

Ini sebuah contoh

Pekerjaan

Siswa

Pejabat Sipil Negara

Karyawan

Pengusaha

                        



7.       Tombol Kirim

Digunakan untuk mengirim data dari halaman web ke server. Setiap elemen formulir memerlukan tombol kirim untuk mengirimkan nama dan nilainya ke aplikasi yang ditentukan dalam atribut ACTION di elemen FORM

Penulisannya : Submit

Ini sebuah contoh

....................

..................


8.       Tombol Reset

Digunakan untuk membatalkan semua proses atau mengatur ulang proses pengisian data yang dilakukan di elemen form input

Penulisannya : Reset

Ini sebuah contoh

....................

..................


Jadi beberapa contoh elemen yang baru digabungkan adalah sebagai berikut

Contoh pembuatan formulir

Nama depan.

nama keluarga. < tipe input = "teks" nama = "nama belakang" />

Kata sandi.

Jenis Kelamin. Laki-laki

Perempuan

Alamat.

Hobi. Baca Buku

seni

Olahraga

Jalan Jalan

Pekerjaan

Siswa

Pejabat Sipil Negara

Karyawan

Pengusaha

                                   


Komentar.



Ini gambarnya

Cara menggunakan elemen pada formulir html



Terima kasih banyak, semoga bermanfaat


Membagikan

Membagikan

BERIKUT FILE HEADER UNTUK CONTOH

25 Maret 2014

File header adalah sebuah file yang digunakan untuk mendefinisikan beberapa file macro, fungsi, variabel dan konstan. File header nantinya akan mengandung beberapa fungsi atau perintah yang akan digunakan dalam program. File header ini sangat penting, karena beberapa perintah tidak akan dapat dijalankan jika file header yang mendukung perintah tersebut tidak ditulis dalam program. File header ini memiliki ciri bereksistensi “.h” dan diarahkan oleh preprocessor dirrective #include sebagai gambaran kepada kompilator bahwa beberapa fungsi yang terdapat dalam file header tersebut diikutkan dalam pembuatan program. Nama file yang memungkinkan dibangun pada program bahasa c++, yang dicantumkan setelah #include. Berisi antara lain informasi fungsi, konstanta, dan variabel dari pustaka (bagian program yang telah tersedia). Berikut beberapa header file yang sering digunakan dalam bahasa C++ : 1. Digunakan untuk menampilkan perintah: a. Cin Dalam C++, perintah cin d

Membagikan

2 komentar

Baca selengkapnya

PERAN CBIS dalam dunia BISNIS dan ORGANISASI

13 Februari 2015

Manajemen tidak dapat mengabaikan sistem informasi karena sistem informasi memainkan peran penting dalam organisasi. Sistem informasi ini secara langsung mempengaruhi bagaimana manajemen mengambil keputusan, membuat rencana, dan mengelola karyawannya, serta meningkatkan target kinerja yang ingin dicapai yaitu bagaimana menetapkan ukuran atau bobot dari setiap tujuan atau kegiatan, menetapkan standar pelayanan minimal, dan bagaimana menetapkan standar dan standar prosedur pelayanan kepada masyarakat. Persaingan merupakan kunci penentu keberhasilan suatu organisasi bisnis. Strategi bersaing yang diterapkan oleh dunia usaha/industri mampu memberikan keunggulan organisasi, dengan memperhatikan faktor biaya, kualitas dan kecepatan proses. Keunggulan bersaing akan mengantarkan organisasi pada kemampuan menguasai pasar dan memperoleh keuntungan bisnis.Strategi perusahaan berbasis sistem informasi perlu dibuat karena sumber daya yang dimiliki perusahaan sangat terbatas, sehingga h

Membagikan

Tulis komentar

Baca selengkapnya

Sistem Manajemen File (sistem manajemen file)

19 Januari 2015

Manajemen file adalah metode dan struktur data yang digunakan oleh sistem operasi untuk mengatur dan mengatur file pada disk atau partisi. Sistem file juga dapat diartikan sebagai partisi atau disk yang digunakan untuk menyimpan file dengan cara tertentu. Cara memberikan sistem file ke disk atau partisi dengan melakukan format. Beberapa fungsi yang diharapkan dari manajemen file adalah. 1. Penciptaan, modifikasi, dan penghapusan file. 2. Mekanisme berbagi file bersama. 3. Kemampuan pencadangan dan pemulihan untuk mencegah kehilangan karena kecelakaan atau upaya untuk menghancurkan informasi. 4. Pengguna dapat merujuk ke file dengan nama simbolik (Symbolic name) alih-alih menggunakan nama yang merujuk ke perangkat fisik. 5. Dalam lingkungan yang sensitif, informasi harus disimpan dengan aman dan rahasia. 6. Sistem file harus menyediakan antarmuka yang ramah pengguna. Sistem Manajemen File Sasaran Pemrosesan file adalah sekelompok perangkat lunak sistem yang

Membagikan

Tulis komentar

Baca selengkapnya

Aplikasi Informasi Pemilu

18 Maret 2014

Menyambut pemilihan umum pada 9 April 2014, sejumlah developer aplikasi lokal menelurkan aplikasi bertema pemilu. Daripada mengunjungi situs KPU yang tidak mudah digunakan dengan tampilan yang cukup buruk, informasi pemilu akan lebih mudah didapatkan melalui aplikasi mobile yang lebih fokus. Kami telah mengumpulkan lima aplikasi Android yang bisa Anda unduh untuk mengetahui informasi seputar pemilu 2014. Game Pemilu 2014  ( GitsMedia ) Mensosialisasikan Pemilu dapat dilakukan dengan berbagai cara, salah satunya melalui game. Berharap dapat menjangkau pemilih muda, developer lokal GitsMedia berkolaborasi dengan STMIK AMIKOM Yogyakarta merilis Game Pemilu 2014. Tampil dengan animasi penuh warna, aplikasi ini menawarkan permainan sederhana serta informasi seluk beluk Pemilu 2014, mulai dari partai peserta hingga calon presiden. Di dalam game, pengguna dapat memainkan tiga judul yang tersedia di dalamnya seperti "Temui Wakil Rakyat", "Ca

Membagikan

Tulis komentar

Baca selengkapnya

Kode Warna di Komputer

06 Maret 2014

Selamat malam teman teman. Batasi posting sambil mendesain, bagikan ilmu yang bermanfaat. . D Pada postingan kali ini saya akan membahas tentang warna. Dalam desain, warna sangat penting. Apa kamu tahu kenapa? . Dalam desain apapun warna sangat diperlukan, nah pada postingan kali ini saya akan membahas tentang HTML Code Color Tool, hampir sebagian besar desainer belum mengenal kode warna. Nah, berikut adalah beberapa warna dan kode warna. Code Color #000000 Black #2C3539 Gunmetal #2B1B17 Midnight #34282C Charcoal #25383C Dark Slate Grey #3B3131 Oil #413839 Black Cat #463E3F Black Eel #4C4646 Black Cow #504A4B Grey Wolf #565051 Vampire Grey #5C5858 Grey Dolphin #625D5D Carbon Grey #666362 Ash Grey #6D6968 Cloudy Grey #726E6D Smokey Grey #736F6E Grey #837E7C Granite #848482 Battleship Grey #B6B6B4 Grey Cloud #D1D0CE Grey Goose #E5E4E2 Platinum #BCC6CC Metallic Silver #98

Membagikan

Tulis komentar

Baca selengkapnya

Cara Memasang Master Cam X2

28 April 2013

Berikut langkah-langkah install master cam X2. Masuk flash master Klik 2x pada file mastercam berupa winrar Klik 2x pada folder mastercam Klik setup exe Klik install mastercam x2 ATP Klik langkah 1 (tunggu sampai selesai/ ikuti petunjuknya) Klik langkah 2 (tunggu sampai selesai/ ikuti petunjuknya) ) Klik kembali ke menu utama Klik install mastercam x2 Ikuti langkah/perintah yang tersedia Setelah selesai tekan finish Klik kembali ke menu utama Tekan exit Buka kembali file di flash Buka crack Copy masterm. exe Buka bintang Buka disk c Temukan folder mmscx Buka folder Tempel (ctrl + V) Tutup tekan X di sudut layar dengan. Rino Kusnanto (RK)

Membagikan

1 Komentar

Baca selengkapnya

Mekanisme Kerja CBIS

19 Januari 2015

Computer Based Information System (CBIS) atau Sistem Informasi “berbasis komputer” artinya komputer memegang peranan penting dalam suatu sistem informasi. Secara teori, penerapan Sistem Informasi tidak harus menggunakan komputer dalam kegiatannya. Namun dalam prakteknya, tidak mungkin suatu sistem informasi yang sangat kompleks dapat berjalan dengan baik tanpa komputer. Sistem Informasi yang akurat dan efektif sebenarnya selalu berkaitan dengan istilah “computer-based” atau pengolahan informasi berbasis komputer. Sub Sistem Sistem Informasi Berbasis Komputer terbagi menjadi beberapa jenis yaitu. A. Sistem Informatika Akuntansi (SIA) b. Sistem Pemrosesan Transaksi (TPS) c. Sistem Informasi Manajemen (SIM) d. Sistem Pendukung Keputusan (SPK) e. Sistem Pakar (ES) f. Otomasi Kantor (OA) I. Akuntansi Sistem Informatika (SIA) Akuntansi

Membagikan

Tulis komentar

Baca selengkapnya

Tips Membuat Custom Widget di Home Screen

23 Maret 2014

Memasang Widget di Home Screen memang menjadi ciri khas Smartphone Android, karena Smartphone di platform lain tidak menyediakan fitur untuk ini. Menggunakan Widget selain untuk menarik perhatian juga dapat membuat pengguna Android mendapatkan informasi atau hal-hal yang dibutuhkan dengan cepat, seperti notifikasi, cuaca, reminder, bahkan headline news. Di Play Store sendiri terdapat banyak sekali widget yang bisa langsung Anda pasang dan gunakan. Namun bagi anda yang mungkin kurang puas dengan widget atau bahkan ingin berkreasi membuat widget sendiri, maka anda membutuhkan sebuah aplikasi bernama Zooper Widget. Zooper Widget merupakan aplikasi yang dapat memudahkan pengguna Android untuk membuat widget sesuka hati. Yap, pada aplikasi ini anda dapat membuat widget sesuai dengan keinginan anda, namun tentunya untuk dapat membuat widget tersebut anda juga harus sedikit memahami tentang bahasa pemrograman atau kode-kode untuk dapat membuatnya.

Elemen apa dalam HTML yang digunakan untuk membuat formulir?

Form adalah bagian dari HTML yang dapat digunakan untuk membuat elemen Form pada halaman Web. Elemen formulir dapat terdiri dari kotak centang, tombol radio, menu, kotak teks, area teks, dan tombol .

Atribut apa yang ditemukan dalam elemen formulir HTML?

Atribut .
accept-charset. Tentukan pengkodean karakter yang diterima oleh server sebelum formulir dikirim. .
tindakan. Tentukan alamat (URL) yang memproses data formulir saat dikirim. .
pelengkapan otomatis. .
enctype. .
metode. .
nama. .
tidak memvalidasi. .
target

Sebutkan elemen apa saja yang ada di HTML?

Elemen dalam HTML . tag pembuka, isi, dan tag penutup.

Apa saja elemen inputnya?

Ada berbagai jenis elemen masukan dalam formulir. .
kata sandi
textarea
Pilih
pilih beberapa
kotak centang
radio