Флажок действует только один раз - PullRequest
2 голосов
/ 06 мая 2019

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

<tbody>
{% for item in items %}
    <th scope="row"><input type="checkbox" id="check" name="wpmm[]"></th>
    <td>{{ item.item_name }}</td>
    <td>{{ item.sku }}</td>
    <td>{{ item.quantity }}</td>
{% endfor %}
</tbody>

Вот скрипт:

var fnUpdateCount = function () {
  var generallen = $("input[name='wpmm[]']:checked").length;
  if (generallen > 0) {
    $("#general i .counter").text('(' + generallen + ')');
  } else {
    $("#general i .counter").text(' ');
  }
};

$("input:checkbox").on("change", function () {
  fnUpdateCount();
});

$('.select_all').change(function () {
  var checkthis = $(this);
  var checkboxes = $("input:checkbox");

  if (checkthis.is(':checked')) {
    checkboxes.prop('checked', true);
  } else {
    checkboxes.prop('checked', false);
  }
  fnUpdateCount();
});

Вот код, который должен отображаться при проверке чечбокса:

<div class="row justify-content-between start-dash mb-4" id="general">
  <div class="col-6">
    <h4 class="text-left mt-4">Selected Items: <span class="counter"></span></h4>
  </div>
</div>

Для этого используется код:

$('#general').hide();
$(function () {
  $('#check').on('change', function () {
    if ($('#check').prop('checked')) {
      $('#item_info').hide();
      $('#general').show();
    } else {
      $('#item_info').show();
      $('#general').hide();
    }
  });
});

1 Ответ

1 голос
/ 06 мая 2019

Попробуйте это:

$(function () {
    $('body').on('change','#check', function (e) {
        e.preventDefault();
        if ($(this).prop('checked')) {
            $('#item_info').hide();
            $('#general').show();
        } else {
            $('#item_info').show();
            $('#general').hide();
        }
    });
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...