jquery .each not working in IE

Question

I have a list of checkbox

<input type="checkbox" name="box1" id="box1" value="x1">X1
<input type="checkbox" name="box1" id="box1" value="x2">X2
<input type="checkbox" name="box1" id="box1" value="x3">X3

The name of the checkbox and the count of checkbox is dynamic.

To retrieve the values of selected checkbox i am using the function as

var urls = "";
var values = "";
var fldname = "box"+i;
$('#'+fldname+':checked').each(function() {
values += $(this).val() +"|";
});

Say I have selected X1 and X3 then in Mozilla the value of "values" is

X1 | X3

While in IE it is just X1.

Please help.

Answer 1

I don't know how your code worked in Mozilla because your syntax is wrong.

You've given all your checkboxes names, but are querying for them using IDs

You need something like

$('[name="' + fldname  + '"]:checked');

This basically looks for elements with the given name. You can make it more specific

$('input[name="' + fldname  + '"]:checkbox:checked');

Here's an example that doesn't use your iteration: http://jsbin.com/ikifi5