javascript - Submit form on select change - Stack Overflow

admin管理员组

文章数量:1291038

This is my code: /

It should submit the form on select change but it doesnt do anything

$(function() {
    $('#candidate_filter').change(function() {
        this.form.submit();
    });
});

Can anyone please explain why this code doesn't work?

This is my code: http://jsfiddle/47apf/

It should submit the form on select change but it doesnt do anything

$(function() {
    $('#candidate_filter').change(function() {
        this.form.submit();
    });
});

Can anyone please explain why this code doesn't work?

• javascript
• jquery
• html

Share Improve this question Follow asked Jul 9, 2014 at 11:10 J.ZilJ.Zil 2,44988 gold badges4646 silver badges8282 bronze badges 1

• 1 this is already the form. try this.submit(); – Hank Lapidez Commented Jul 9, 2014 at 11:14

Add a ment  | 

7 Answers 7

Sorted by: Reset to default 5

Well, you don't need the .form in this case.

$(function() {
  $('#candidate_filter').change(function() {
    this.submit();
  });
});

Here, this itself is the form.

Write this:

$('#candidate_filter').change(function() {
    $(this).trigger('submit');
});

Updated fiddle here.

Try this

$('#candidate_filter').change(function() {
        //alert("hii");
        this.submit();
    });

Fiddle: fiddle

You need to assign id of drop down as below:

    <form id="candidate_filter">
    <select name="vacancy" id="candidate_filter1">
    <option value="all">Any Vacancy</option>
    <option value="1">Engineering lk;lk;</option>
    </select>
    <select name="status" id="candidate_filter2">
    <option value="all">Any Status</option>
    <option value="open">Open for applications</option>
    <option value="closed">Closed for applications</option>
    <option value="inactive">Inactive</option>
    </select>
    <select name="date">
    <option value="all">Any Date</option>
    <option value="today">Today</option>
    <option value="3">3 days</option>
    <option value="7">This week</option>
    </select>
    <select name="consideration" id="candidate_filter3">
    <option value="all">Any Consideration</option>
    <option value="qualified">Qualified</option>
    <option value="rejected">Rejected</option>
    </select>
    <input type="submit">
    </form>

JS

    $(function() {
        $('select[id^="candidate_filter"]').change(function() {
            this.form.submit();
        });
    });

DEMO

You have to submit the form like this: $('#candidate_filter').submit();

Here is a working JSFiddle: http://jsfiddle/47apf/5/

JQuery

$(function() {
    $('#candidate_filter').change(function() {
        alert("change event catched");
         $('#candidate_filter').submit();
    });
});

You can do like this in jQuery.

Put a class on your select, and bind the event onchange

 $('.candidateList').on('change', function(evt){
    $('#candidate_filter').submit();
});

http://jsfiddle/darksioul/4ygAg/2/

Try:

$(function() {
    $('#candidate_filter select[name="vacancy"]').change(function() {
        $('#candidate_filter').submit();
    });
});

Inside jQuery selectors, the this word references to the selected element on DOM, in you original code, $('#candidate_filter') represents the FORM element. Adding a second reference you have a better approach to what you desire $('#candidate_filter select[name="vacancy"]'). And to submit the form, you need to point especifically to the FORM element.

本文标签： javascriptSubmit form on select changeStack Overflow