jQuery "Auto Post-back" Select/Drop-Down List
Posted
by Doug Lampe
on Geeks with Blogs
See other posts from Geeks with Blogs
or by Doug Lampe
Published on Mon, 07 Feb 2011 22:15:21 GMT
Indexed on
2011/02/07
23:26 UTC
Read the original article
Hit count: 350
I have one common piece of jQuery code which I use to submit a form any time the selection changes on a drop-down list (HTML select tag). This is similar to setting AutoPostBack = true in ASP.Net. I use a single CSS class (autoSubmit) to annotate that I want the drop-down to force the form to submit on change so the HTML looks something like this:
<select id="myAutoSubmitDropDown" name="myAutoSubmitDropDown" class="autoSubmit">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
</select>
Then the following jQuery will look for any element with this CSS class and submit the parent form when the value is changed:
function wireUpAutoSubmit() {
$(".autoSubmit").each(function (index) {
$(this).change(function () {
$(this).closest('form').submit();
})
});
}
I put this in a separate function since I might need to wire this up explicitly after an ajax call. Therefore I use the following code to set this method to fire when the DOM is loaded:
$(document).ready(function () {
wireUpAutoSubmit();
});
© Geeks with Blogs or respective owner