Скопировать состояние проверки набора флажков в другой набор полей

Question

Я работаю над проектом, где у меня есть fieldset # a , как это.

<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>

Этот fieldset # a : установлен значение - Динамическое.

У меня есть еще один fieldset # b на той же странице.

Я хочу назначить / скопировать флажок: отмечен значение из fieldset #a к fieldset # b Последовательно при загрузке страницы. [Оба набора полей имеют одинаковое количество флажков.]

<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>

Как мне этого добиться?Спасибо.

Answer 1

Вы можете сделать это с помощью того селектора, который вы упомянули, а затем зациклить каждое из значений, получить их индекс и обновить флажки следующих наборов полей в соответствии с этими признаками.

Как это:

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

пример: http://jsfiddle.net/niklasvh/hHnLu/

Answer 2

Я не смог заставить работать все выше, поэтому я попробовал подход ниже, и это сработало.

// lets uncheck all the checkboxes in first fieldset                                                                                             
$('#b input[type=checkbox]').removeProp('checked');                                    

  cj('#b [type=checkbox]').each(function() {
     if (cj(this).prop('checked') ) {
         // here get the index of current element 
         // then modify below code to set prop checked
         cj('#a [type=checkbox]').prop('checked',true);
     }
});

Надеюсь, это поможет !!!

Answer 3

Вы можете использовать что-то вроде этого:

$( '#b' ).children( 'input:checkbox' ).each( function( i ) {
    var aChecked = $( '#a' ).children( 'input:checkbox' ).eq( i ).prop( 'checked' );
    if ( aChecked )
    {
        $( this ).prop( 'checked', true );
    }
    else
    {
        $( this ).removeProp( 'checked' );
    }
} );