Bagaimana cara mengirimkan formulir pada perubahan daftar dropdown?

293

Saya membuat halaman di JSP di mana saya memiliki daftar dropdown dan setelah pengguna memilih nilai dia harus mengklik tombol go dan kemudian nilai dikirim ke Servlet.

            </select>
            <input type="submit" name="GO" value="Go"/>

Bagaimana saya membuatnya sehingga itu bisa berubah? Misalnya ketika pengguna memilih John, semua detailnya diambil dari DB dan ditampilkan. Saya ingin sistem melakukannya tanpa harus mengklik tombol go.

html jsp John
sumber

Jawaban:

662

Mintalah bantuan JavaScript.

<select onchange="this.form.submit()">
    ...
</select>

Lihat juga:

BalusC
sumber
6
Banyak pengguna memblokir javascript, apakah ada cara untuk melakukan ini tanpa javascript?
deweydb
5
@deweydb: Tidak. Kalau tidak, saya akan menjawabnya :) Cukup tunjukkan <noscript>spanduk bahwa pengalaman situs lebih baik jika JS diaktifkan. Alternatif yang sama sekali berbeda adalah dengan menggunakan <ul><li><input type="submit">dan membuang CSS untuk membuatnya terlihat seperti daftar dropdown yang benar. Tapi kemudian tidak ada cara <select>lagi.
BalusC
89
@deweydb "Banyak pengguna memblokir javascript ..." Kutipan? Jujur saya tidak pernah menemukan pengguna yang memblokir javascript - Saya mulai percaya bahwa pengguna ini adalah mitos. Ini akan mencegah mereka menggunakan setengah dari internet, untuk satu hal; dan siapa pun yang cukup pintar untuk memblokir skrip mungkin menyadari betapa tidak berbahaya dan di mana-mana itu.
Nathan Hornby
7
@BalusC tolong tambahkan ini untuk orang-orang yang khawatir tentang pengguna yang tidak mengaktifkan javascript <noscript>This form requires that you have javascript enabled to work properly please enable javascript in your browser.</noscript> juga @NathanHornby jika Anda benar-benar ingin kutipan mengapa Anda tidak pergi ke perpustakaan umum sebagian besar blok javascript perpustakaan umum untuk alasan keamanan serta beberapa sekolah juga jadi jangan ' t mencoba untuk menganggapnya sebagai mitos yang telah dan sedang dilakukan terutama karena alasan keamanan untuk menjaga integritas komputer karena beberapa javascript adalah kode berbahaya ...
Belldandu
10
@deweydb Sederhana saja. Cukup masukkan submittombol di <noscript>tag. Ini hanya akan ditampilkan jika pengguna menggunakan noscript. Pengguna yang memiliki JS diaktifkan dapat dengan mudah memilih elemen, dan pengguna dengan noscript hanya akan mengklik tombol kirim. :)
Aaron Esau
81

JavaScript sederhana akan dilakukan - 

<form action="myservlet.do" method="POST">
    <select name="myselect" id="myselect" onchange="this.form.submit()">
        <option value="1">One</option>
        <option value="2">Two</option>
        <option value="3">Three</option>
        <option value="4">Four</option>
    </select>
</form>

Berikut ini tautan untuk tutorial javascript yang bagus .

MD Sayem Ahmed
sumber
Terima kasih !, Di atas satu bekerja untuk MVC juga @ menggunakan (Html.BeginForm ("Actioname", "controllername", FormMethod.Post)) <pilih nama = "myselect" id = "myselect" onchange = "this.form.submit () "> <nilai opsi =" 1 "> Satu </option> <opsi nilai =" 2 "> Dua </option> <opsi nilai =" 3 "> Tiga </option> <opsi nilai =" 4 " > Empat </option> </select>
charulatha krishnamoorthy
11

selain menggunakan this.form.submit()Anda juga mengirimkan dengan id atau nama. contoh saya punya formulir seperti ini:<form action="" name="PostName" id="IdName">

  1. Dengan nama : <select onchange="PostName.submit()">

  2. Dengan Id: <select onchange="IdName.submit()">

wedos sate
sumber
Tidak perlu JavaScript!
MikeyE
saya pikir 'kirim ()' adalah Elemen HTML. bukan javascript. CMIIW
sate wedos
Saya tahu, itulah yang saya maksud dengan komentar saya. Saya mencoba memberi Anda beberapa alat peraga. :-)
MikeyE
Tunggu, apakah itu serius bukan JavaScript?
James Haug
10
Apa pun yang ditulis di dalam atribut * diinterpretasikan sebagai Javascript. Jadi PostName.submit () adalah javascript.
Asif Shahzad
9

Untuk yang ada di jawaban di atas. Ini jelas JavaScript. Itu hanya sebaris.

BTW setara jQuery jika Anda ingin menerapkan semua pilihan:

$('form select').on('change', function(){
    $(this).closest('form').submit();
});
nitsram
sumber