Belajar Membuat Formulir Data dari Pemrograman HTML

Belajar Membuat Formulir Data dari Pemrograman HTML



Formulir digunakan untuk mengumpulkan data yang dimasukkan oleh pengguna. Mereka dapat digunakan sebagai antarmuka untuk aplikasi web, misalnya, atau untuk mengirim data ke seluruh web.

Pada mereka sendiri, bentuk biasanya tidak sangat membantu. Mereka cenderung digunakan dalam hubungannya dengan bahasa pemrograman untuk memproses informasi yang diinput oleh pengguna. Script ini mengambil segala macam samaran yang sebagian besar di luar mengirimkan situs ini karena mereka memerlukan bahasa selain HTML dan CSS.

Tag dasar yang digunakan dalam HTML bentuk yang sebenarnya adalah bentuk, input, textarea, pilih dan pilihan.

Form

form mendefinisikan form dan di dalam tag ini, jika Anda menggunakan formulir bagi pengguna untuk mengirimkan informasi (yang kami asumsikan pada tingkat ini), atribut tindakan diperlukan untuk memberi tahu formulir ke mana kontennya akan dikirim.

Atribut metode memberi tahu formulir bagaimana data di dalamnya akan dikirim dan dapat memiliki nilai dapatkan, yang merupakan default, dan mengunci informasi formulir ke alamat web, atau posting, yang (pada dasarnya) secara tak terlihat mengirimkan informasi formulir .

get digunakan untuk potongan informasi non-sensitif yang lebih pendek - Anda mungkin melihat informasi yang Anda kirimkan dalam pencarian situs web muncul di alamat web halaman hasil pencariannya, misalnya. pos digunakan untuk pengiriman yang lebih panjang, lebih aman, seperti dalam formulir kontak.

Jadi elemen bentuk akan terlihat seperti ini:

<form action="processingscript.php" method="post"> </form>

Input

Tag input adalah ayah dari dunia formulir. Hal ini dapat mengambil banyak samaran, yang paling umum yang diuraikan di bawah ini (Lihat halaman referensi masukan untuk seluruh keluarga gila):


  • < input type =  "text " > atau hanya <input> adalah textbox standar. Ini juga dapat memiliki nilai atribut, yang menetapkan teks awal di textbox.
  • < input type =  "password " > mirip dengan TextBox, namun karakter yang diketik oleh pengguna akan disembunyikan.
  • < input type =  "checkbox " > adalah kotak centang, yang dapat toggled on dan off oleh pengguna. Ini juga dapat memiliki atribut diperiksa (< input type =  "checkbox " diperiksa >-atribut tidak memerlukan nilai), dan membuat keadaan awal kotak centang yang akan diaktifkan, seperti itu.
  • < input type =  "radio " > mirip dengan kotak centang, tetapi pengguna hanya dapat memilih satu tombol radio dalam grup. Ini juga dapat memiliki atribut yang dicentang.
  • < input type =  "submit " > adalah tombol yang ketika terpilih akan mengirimkan form. Anda dapat mengontrol teks yang muncul pada tombol submit dengan atribut Value, misalnya < input type =  "submit " value =  "Ooo. Look. Teks pada tombol. Wow " >.

Perhatikan bahwa, seperti Tag IMG dan br, tag input, yang tidak mengelilingi konten apa pun, tidak memerlukan tag penutup.

Textarea

textarea adalah, pada dasarnya, besar, multi-baris textbox. Jumlah diantisipasi baris dan kolom dapat didefinisikan dengan atribut baris dan cols, meskipun Anda dapat memanipulasi ukuran konten hati Anda menggunakan CSS.

<textarea rows="5" cols="20">A big load of text</textarea>

Setiap teks yang Anda pilih untuk ditempatkan di antara tag pembuka dan penutup (dalam hal ini "beban besar teks") akan membentuk nilai awal dari area teks.

Select

Tag pilih berfungsi dengan tag pilihan untuk membuat kotak Pilih drop-down.

<select> <option>Option 1</option> <option>Option 2</option> <option value="third option">Option 3</option> </select>

Ketika formulir diserahkan, nilai pilihan yang dipilih akan dikirim. Nilai ini akan menjadi teks antara tag opsi pembuka dan penutup yang dipilih kecuali nilai eksplisit ditentukan dengan atribut Value, dalam hal ini akan dikirim sebagai gantinya. Jadi, dalam contoh di atas, jika item pertama dipilih, "opsi 1" akan dikirim, jika item ketiga dipilih, "pilihan ketiga" akan dikirim.

Mirip dengan atribut diperiksa kotak centang dan tombol radio, tag pilihan juga dapat memiliki atribut yang dipilih, untuk memulai dengan salah satu item yang sudah dipilih, misalnya. < option dipilih > Rodent </option> akan pra-pilih "Rodent" dari item.

Names

Semua tag yang disebutkan di atas akan terlihat sangat bagus disajikan pada halaman tetapi jika Anda menghubungkan formulir Anda ke bentuk-penanganan script, mereka semua akan diabaikan. Hal ini karena kolom formulir memerlukan nama. Jadi untuk semua Field, nama atribut perlu ditambahkan, misalnya < input type =  "text " name =  "talkingsponge " >.

Sebuah formulir kontak untuk bahtera Nuh, misalnya, mungkin terlihat seperti yang ada di bawah ini. (Catatan: formulir ini tidak akan bekerja kecuali ada file "contactus. php", yang dinyatakan dalam atribut Action dari tag form, untuk menangani data yang dikirimkan).

<form action="contactus.php" method="post">
 <p>Name:</p>
 <p><input type="text" name="name" value="Your name"></p> <p>Species:</p>
 <p><input name="species"></p>
 <!-- remember: 'type="text"' isn't actually necessary --> <p>Comments: </p>
 <p><textarea name="comments" rows="5" cols="20">Your comments</textarea></p>
 <p>Are you:</p>
 <p><input type="radio" name="areyou" value="male"> Male</p> <p><input type="radio" name="areyou" value="female"> Female</p>
 <p><input type="radio" name="areyou" value="hermaphrodite"> An hermaphrodite</p>
 <p><input type="radio" name="areyou" value="asexual"> Asexual</p>
 <p><input type="submit"></p>
 </form>

Anda mungkin menyukai postingan ini