Metasearch - Help with Jquery ajax request when checkbox is pressed
I want to make a Jquery ajax request when a checkbox pressed either true or false.
My form:
<form method="get" action="/" accept-charset="UTF-8"><div style="margin: 0pt; padding: 0pt; display: inline;"><input name="utf8" value="✓" type="hidden"></div>
<div class="menuitem">
<label for="search_compan开发者_JAVA百科y1">company1</label>
<input name="search[company1_is_true]" value="0" type="hidden"><input id="search_company1_is_true" name="search[company1_is_true]" value="1" type="checkbox">
</div>
<div class="menuitem">
<label for="search_company2">company2</label>
<input name="search[company2_is_true]" value="0" type="hidden"><input id="search_company2_is_true" name="search[company2_is_true]" value="1" type="checkbox">
</div>
<div class="menuitem">
<label for="search_company3">company3</label>
<input name="search[company3_is_true]" value="0" type="hidden"><input id="search_company3_is_true" name="search[company3_is_true]" value="1" type="checkbox">
</div>
<input id="search_submit" name="commit" value="Create Search" type="submit">
</form>
This launches custom doAjaxRequest function after any of the checkboxes in menuitem class are changed to either true or false.
$('.menuitem input:checkbox').change(function(){
doAjaxRequest();
})
Answer to first comment question:
$('.menuitem input:checkbox').change(function(){
$('form').submit();
})
Though you probably want to define some id to your form and use it instead of just form selector: $('#formId')
EDIT I just made jsfiddle of your code in question and my second answer and it seems to work: http://jsfiddle.net/dUPmg/
Should be a fairly trivial task:
$('form input:checkbox').change(function() {
// $.ajax({});
$('form').submit();
});
That would bind a change-eventhandler to each checkbox element. When the number of those elements increases, you should go for a delegated change-event instead.
$('form').delegate('input:checkbox', 'change', function( e ) {
switch( e.id ) {
case 'search_company1_is_true':
$.ajax({});
break;
case 'search_company2_is_true':
$.ajax({});
break;
// and so forth
}
});
$('form input:checkbox').bind('click change', function(){
$.ajax({
url: "/test.html",
success: function(){
$(this).addClass("done");
}
});
});
精彩评论