Jak przesłać formularz dotyczący zmiany listy rozwijanej?

292

Tworzę stronę w JSP, na której mam listę rozwijaną, a gdy użytkownik wybierze wartość, musi kliknąć przycisk Start, a następnie wartość jest wysyłana do serwletu.

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

Jak to zrobić, aby zmieniło się? Np. Gdy użytkownik wybierze Johna, wszystkie jego dane zostaną pobrane z bazy danych i wyświetlone. Chcę, aby system to zrobił bez konieczności klikania przycisku Start.

Jan
źródło

Odpowiedzi:

661

Poproś o pomoc JavaScript.

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

Zobacz też:

BalusC
źródło
6
Wielu użytkowników blokuje javascript, czy istnieje sposób, aby to zrobić bez javascript?
deweydb
5
@deweydb: Nie. W przeciwnym razie odpowiedziałbym na to :) Po prostu pokaż <noscript>baner, że korzystanie ze strony jest lepsze, jeśli JS jest włączony. Zupełnie inną alternatywą jest użycie <ul><li><input type="submit">i dodanie CSS, aby wyglądało jak prawdziwa lista rozwijana. Ale nie ma <select>już możliwości.
BalusC
89
@deweydb „Wielu użytkowników blokuje javascript…” Cytowanie? Szczerze mówiąc, nigdy nie spotkałem użytkownika, który blokuje javascript - zacząłem wierzyć, że ci użytkownicy to mit. Po pierwsze uniemożliwiłoby im to korzystanie z połowy Internetu; a każdy na tyle bystry, by zablokować skrypt, jest prawdopodobnie świadomy, jak niewinny i wszechobecny jest.
Nathan Hornby
7
@BalusC proszę dodać to dla osób, które martwią się, że użytkownicy nie mają włączonego javascript, <noscript>This form requires that you have javascript enabled to work properly please enable javascript in your browser.</noscript> również @NathanHornby, jeśli naprawdę chcesz cytować, dlaczego nie idziesz do biblioteki publicznej większości javascript blokowy biblioteki publicznej ze względów bezpieczeństwa, a także niektóre szkoły też nie ' próbuję przekazać to jako mit, który ma i jest robiony głównie ze względów bezpieczeństwa w celu zachowania integralności komputerów, ponieważ niektóre javascript to złośliwy kod ...
Belldandu
9
@deweydb To proste. Wystarczy umieścić submitprzycisk w <noscript>tagach. Wyświetla się tylko wtedy, gdy użytkownicy używają noscript. Użytkownicy, którzy mają włączoną obsługę JS, mogą po prostu wybrać element, a użytkownicy z noscript klikną przycisk Prześlij. :)
Aaron Esau,
81

Prosty JavaScript zrobi -

<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>

Oto link do dobrego samouczka javascript .

MD Sayem Ahmed
źródło
Dzięki !, Powyżej jeden działa również dla MVC @ @ (Html.BeginForm („Actioname”, „nazwa_kontrolera”, FormMethod.Post)) <select name = "myselect" id = "myselect" onchange = "this.form.submit () "> <opcja wartość =" 1 "> Jedna </option> <wartość opcji =" 2 "> Dwie </option> <wartość opcji =" 3 "> Trzy </option> <wartość opcji =" 4 " > Cztery </option> </select>
charulatha krishnamoorthy
11

inne niż wykorzystanie this.form.submit()Ciebie również przesłanie przez identyfikator lub nazwę. przykład mam taką formę:<form action="" name="PostName" id="IdName">

  1. Wg nazwy : <select onchange="PostName.submit()">

  2. Według identyfikatora: <select onchange="IdName.submit()">

sate wedos
źródło
JavaScript nie jest potrzebny!
MikeyE,
myślę, że „Submit ()” to HTML Element. nie javascript. CMIIW
sate wedos
Wiem, o to mi chodziło w moim komentarzu. Próbowałem dać ci jakieś rekwizyty. :-)
MikeyE
Zaraz, czy to naprawdę nie JavaScript?
James Haug,
10
Wszystko, co jest zapisane w * atrybutach, jest interpretowane jako JavaScript. Więc PostName.submit () jest javascript.
Asif Shahzad
9

Do osób w powyższej odpowiedzi. To zdecydowanie JavaScript. Jest po prostu wbudowany.

BTW ekwiwalent jQuery, jeśli chcesz zastosować do wszystkich wybranych:

$('form select').on('change', function(){
    $(this).closest('form').submit();
});
nitsram
źródło