Como enviar um formulário na mudança da lista suspensa?

293

Estou criando uma página no JSP em que tenho uma lista suspensa e, uma vez que o usuário seleciona um valor, ele deve clicar no botão ir e, em seguida, o valor é enviado ao Servlet.

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

Como faço para que ele seja alterado? Por exemplo, quando o usuário seleciona John, todos os seus detalhes são recuperados do banco de dados e exibidos. Quero que o sistema faça isso sem precisar clicar no botão ir.

html jsp John
fonte

Respostas:

662

Basta solicitar assistência do JavaScript.

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

Veja também:

BalusC
fonte
6
Muitos usuários bloqueiam javascript, existe uma maneira de fazer isso sem javascript?
deweydb
5
@deweydb: Não. Caso contrário, eu teria respondido :) Apenas mostre a um <noscript>banner que a experiência do site é melhor se o JS estiver ativado. Uma alternativa completamente diferente é usar <ul><li><input type="submit">e lançar uma carga de CSS para parecer uma verdadeira lista suspensa. Mas então não há mais meios de a <select>.
BalusC
89
@deweydb "Muitos usuários bloqueiam javascript ..." Citação? Sinceramente, nunca deparei com um usuário que bloqueie o javascript - comecei a acreditar que esses usuários são um mito. Isso os impediria de usar metade da internet, por um lado; e qualquer pessoa experiente o suficiente para bloquear o script provavelmente está ciente de quão inócuo e onipresente é.
Nathan Hornby
7
@BalusC, adicione-o a pessoas preocupadas com o fato de os usuários não terem o javascript ativado <noscript>This form requires that you have javascript enabled to work properly please enable javascript in your browser.</noscript> também @ NathanHornby, se você realmente quer uma citação, por que você não vai a uma biblioteca pública javascript de bloco da maioria das bibliotecas públicas por razões de segurança e também para algumas escolas? ' t tentar passá-lo como um mito que tem e está sendo feito principalmente por razões de segurança para manter a integridade de computadores como alguns javascript é código malicioso ...
Belldandu
10
@deweydb É simples. Basta colocar um submitbotão em <noscript>tags. Só será exibido se os usuários usarem noscript. Os usuários com o JS ativado podem simplesmente selecionar o elemento, e os usuários com noscript apenas clicarão no botão enviar. :)
Aaron Esau
81

JavaScript simples serve - 

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

Aqui está um link para um bom tutorial sobre javascript .

MD Sayem Ahmed
fonte
Obrigado !, Acima também é trabalhado para o MVC @using (Html.BeginForm ("Actioname", "nome do controlador", FormMethod.Post)) <select name = "myselect" id = "myselect" onchange = "this.form.submit () "> <option value =" 1 "> Um </option> <option value =" 2 "> Dois </option> <option value =" 3 "> Três </option> <option value =" 4 " > Quatro </option> </select>
charulatha krishnamoorthy
11

além de this.form.submit()você também enviar por ID ou nome. exemplo eu tenho forma como esta:<form action="" name="PostName" id="IdName">

  1. Por nome: <select onchange="PostName.submit()">

  2. Por ID: <select onchange="IdName.submit()">

saciar wedos
fonte
Não é necessário JavaScript!
6138 MikeyE
Eu acho que 'submit ()' é elemento HTML. não é javascript. CMIIW
sate wedos
Eu sei, é isso que eu quis dizer com o meu comentário. Eu estava tentando lhe dar alguns adereços. :-)
MikeyE
Espere, isso seriamente não é JavaScript?
James Haug
10
Qualquer coisa escrita dentro dos atributos * é interpretada como Javascript. Portanto, PostName.submit () é javascript.
Asif Shahzad
9

Para aqueles na resposta acima. Definitivamente é JavaScript. É apenas inline.

Entre o equivalente jQuery se você deseja aplicar a todos os seletores:

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