How to submit a form with select without Submit button?

Asked

Viewed 4,234 times

1

Good evening, how do I submit a form with select without the Ubmit button? For example, to create a filter that when selecting the option it automatically submits the form without having the Submit button.

My form is like this:

<form class="form-inline left" method="POST">
            <div class="form-group">
                <label for="listar">Listar por</label>
                <select id="filtro" name="filtro" class="form-control">
                    <option value="professor">Professor</option>
                    <option value="assunto">Assunto</option> 
                </select>
            </div>
        </form>
  • 1

    Vinicius, I noticed you never marked how I accept an answer to your question. It is advisable to do so, who helps you receive points for having given the answer that best solved your problem. You can read more about this at the meta: http://meta.pt.stackoverflow.com/q/1078/129

1 answer

3


You can do this directly in select with onchange="this.form.submit()":

<select id="filtro" name="filtro" class="form-control" onchange="this.form.submit()">

That way when the event change is created it sends the form directly.

Example: https://jsfiddle.net/kgfcetud/

Another way is to use an event headphone like this:

document.getElementById('filtro').addEventListener('change', function() {
    this.form.submit();
});

Example: https://jsfiddle.net/rdhcp58d/

  • 1

    Thanks, that’s exactly what I wanted, but it doesn’t get a little obstructive? Would you have another solution?

  • 1

    @Viniciusaquino this is the React style way, but I’ve added another version now. The first has the advantage of leaving the related code already in the element, since it is little code and only concerns itself.

  • @Sergio without Submit every time it is selected some option will be sent, in case you click the wrong option also correct ? There is another way to prevent this without Submit?

  • @Magichat each time the value changes, but not only with click to open.

  • Thank you very much!

Browser other questions tagged

You are not signed in. Login or sign up in order to post.