1

Есть список с чекбоксами и массив вида arr{id: i; person: name; state: notActive}. Как сделать, чтобы при нажатии на определенный чекбокс state: not становился state: active.

<ul id="list">
  <li>
    <div class="field">
      <label> <input type="checkbox">First</label>
    </div>
  </li>
  <li>
    <div class="field">
      <label> <input type="checkbox">Second</label>
    </div>
  </li>
  <li>
    <div class="field">
      <label> <input type="checkbox">Third</label>
    </div>
  </li>
</ul>
<input type="checkbox"> Выбрать всех
5
  • 2
    Легко. Но как Вы решили? Или Вы дали ТЗ и вперёд?
    – user207618
    23 мар 2017 в 19:26
  • jsfiddle.net/0hsaca1u забыл добавить свое решение
    – Imp3l
    23 мар 2017 в 19:35
  • @Imp3l F12 - Console
    – user176262
    23 мар 2017 в 19:36
  • @Igor проверял уже. не работает. если бы работало, то я бы не обратился сюда
    – Imp3l
    23 мар 2017 в 19:37
  • Есть подозрение что Вы просто наспех каких-то строк накидали, чтобы показать что Вы что-то делали. Код мало того, что не работает, так ещё непонятно как должен работать.
    – user207618
    23 мар 2017 в 19:40

1 ответ 1

3

Нужно перебрать все значения в массиве и у каждого поменять переменную

var arr = [],
    $field = $('.field'),
    $field_input = $('.field input'),
    $all = $('#all');

// Создаём массив
$field.each(function(i) {
  $label = $(this).find('label');

  arr[i] = {id: i, person: $label.text(), state: false};
})

// Нажатие на input
$field_input.click(function() {
  var i = $field.index( $(this).parents('.field') );
  
  arr[i].state = this.checked ? true : false;
  
  console.log( arr );
});

// Нажатие на checkbox "все"
$all.click(function() {
  if( !this.checked ){
    // Отключаем везде checked
    $field.find('input').prop('checked', false);
    
    // Изменяем переменную во всех элементах массива
    $.each(arr, function() {
      this.state = false;
    });
  }else{
    // Включаем везде checked
    $field.find('input').prop('checked', true);
    
    // Изменяем переменную во всех элементах массива
    $.each(arr, function() {
      this.state = true;
    });
  };
  
  console.log( arr );
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

<ul id="list">
  <li>
    <div class="field">
      <label><input type="checkbox">First</label>
    </div>
  </li>
  <li>
    <div class="field">
      <label><input type="checkbox">Second</label>
    </div>
  </li>
  <li>
    <div class="field">
      <label><input type="checkbox">Third</label>
    </div>
  </li>
</ul>

<input type="checkbox" id="all"> Выбрать всех

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.