How to convert onchange="this.form.submit()" to jquery

Question

How to convert the onchange="this.form.submit()" to jQuery format?

<form action="process.php" method="post">
  <select name="qty" onchange="this.form.submit()">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
  </select>
</form>

I got a problem because some of browser will do nothing on the process.php if use onchange="this.form.submit()"

Let me know..

Answer 1

Like this:

$('select[name="qty"]').change(function(){
  $(this).parents('form').submit();
});

Answer 2

You don't need to do anything. Whilst you can change this.form.submit() to $(this).closest('form').submit(), this will have no effect (apart from being slightly less readable) as all jQuery will do with that will be to call this.form.submit().

If you have a problem with submitting the form from plain JavaScript, you will still have the same problem submitting it with jQuery. What exactly is that problem?

In any case you should generally not use auto-submitting select boxes. They break keyboard accessibility (since IE fires onchange prematurely from keyboard use) and they interact poorly with the back button.

Answer 3

such questions always remember me of things like this. why do you want to use jquery for such a simple thing? give a name to your form and do document.myform.submit(); (which will work in IE3.0+, FF1.0+, Safari1.0+, Opera5.12+, Konqueror3.1+ ... (how about jQuery?)).

Answer 4

add an id to form and write:

$('#formid select[name=qty]').change(function(){
    $('#formid').submit();
});