Question

I’m working on project where I have fieldset #a like this.

<fieldset id="a">
      <input type="checkbox" name="c1" value="v1" checked="checked" />
      <input type="checkbox" name="c2" value="v2"/>
      <input type="checkbox" name="c3" value="v3"/>
</fieldset>

This fieldset #a checkbox : is checked value is Dynamic.

I have another fieldset #b on the same page.

What I want is to Assign/Copy checkbox : is checked value from fieldset #a to fieldset #b Serially on page load. [ Both fieldset have equal number of checkboxes. ]

<fieldset id="b">
      <input type="checkbox" name="cc1" value="vv1"/>
      <input type="checkbox" name="cc2" value="vv2"/>
      <input type="checkbox" name="cc3" value="vv3"/>
</fieldset>

How can I achieve this ? Thanks.

Answer 1

You could do it using that selector you mentioned and then looping each of the values, getting their index, and updating the next fieldsets checkboxes according to those indicies.

Like this:

$('fieldset#a input[type="checkbox"]:checked').each(function(){   
    $('fieldset#b input[type="checkbox"]').eq($(this).index()).prop('checked',true);
});

example: http://jsfiddle.net/niklasvh/hHnLu/