Monday, August 8, 2011

grails + jquery + checkboxes

sometimes forms based on checkboxes can be rather annoying. An example would be that this is the return of a standard html checkbox,

html defined checkboxes:

<g:checkBox name="compare" id="1"/>
<g:checkBox name="compare" id="2"/>
<g:checkBox name="compare" id="3"/>


result of the send parameters to the server:



def compareBins = {
println params
}

out:

compare:[on, on, on]


now this is rather useless, we rather would see the id of the checkbox in the result. So let's call jQuery to the rescue and see how it can save out day!



jQuery(document).ready(function() {
$('input:checkbox').each(
function() {
$(this).click(function() {

if (this.checked) {
var value = $(this).attr('id');
$(this).val(value);
}
});
}
);
});



and promptly we have the following result if all 3 boxes are selected


compare:[1,2,3]


or if 1 and 3 are selected


compare:[1,3]


so we can actually tell, which elements where checked instead of getting just 'on'

No comments:

Post a Comment