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.

html jsp

— Jan
źródło

661

Poproś o pomoc JavaScript.

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

Zobacz też:

HTML dog - tutorial JavaScript

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

Wg nazwy : <select onchange="PostName.submit()">
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