Cara Menggunakan JavaScript Untuk Auto-Submit Menu Dropdown

Satu hal yang saya temukan yang menjengkelkan, sebagai pengguna, adalah ketika Anda diminta untuk memilih pilihan dari bentuk dropdown, dan sekali dipilih, itu harus menekan tombol submit / kirim. Dalam tutorial ini saya akan menunjukkan Anda cara menggunakan JavaScript untuk melakukan Auto Submit pada menu dropdown.

Banyak pengguna mengharapkan dalam <pilih> elemen (menu dropdown) harus menekan tombol kirim sehingga akan merasa telah kurang efektif dan kurang modern. Solusi untuk mengatasinya adalah mengirimkan secara otomatis.

Berikut adalah contoh dari bentuk seperti itu tanpa auto-klik. Ketika Anda membuat pilihan, Anda diminta untuk mengirimkan formulir menggunakan standar tombol submit: :

Milk Coffee Tea

Sekarang di sini adalah bentuk yang sama dengan auto-kirim JavaScript :

Milk Coffee Tea

Meskipun tidak ada tindakan yang melekat pada formulir ini, Anda dapat melihat bahwa hal ini disampaikan oleh tindakan browser web (yaitu dalam yang pertama, tidak ada tindakan terjadi ketika Anda membuat pilihan ... di kedua, Anda dapat melihat bahwa formulir tersebut diajukan).

Berikut adalah kode yang digunakan untuk bentuk yang ditunjukkan di atas. Pada dasarnya, satu-satunya perbedaan dalam bentuk di atas hanyalah sebuah pernyataan onchange,bersama dengan tag noscript yang memungkinkan browser yang tidak JavaScript-enabled masih berfungsi:

<form>
<select name='myfield' onchange='this.form.submit()'>
  <option selected>Milk</option>
  <option>Coffee</option>
  <option>Tea</option>
</select>
<noscript><input type="submit" value="Submit"></noscript>
</form>

Perhatikan bahwa event onchange dapat ditambahkan ke bentuk apapun, dan setiap elemen, termasuk tombol radio, pilih elemen, dan bahkan bidang teks. Membuat dunia menjadi tempat yang lebih baik dan menggunakan formulir auto-menyerahkan setiap kali Anda membuat formulir. Dengan menggunakan tag noscript, setiap pengguna dapat mengirimkan formulir, dan bagi kita dengan JavaScript diaktifkan (yang sebagian besar dari kita) akan disimpan frustrasi dan upaya mengirimkan formulir secara manual. Aku tahu itu tidak banyak, tetapi menambahkan sentuhan profesionalisme dan interaksi ke situs Anda yang pengunjung Anda akan menghargai. 

• Tweet
• Share
• Share
• Share
• Share