在Laravel-blade中选中所有复选框的好方法

Question

有没有什么好方法可以把“全勾选”按钮放在Blade PHP上？我试着用JavaScript来控制它。但是，每个复选框名称都是不同的。甚至我也意识到这种方式似乎不是一个好方法。

<script language="JavaScript" type="text/javascript">
      function AllChecked(){
        var all = document.form.all.checked;
        for (var i=0; i<document.form.test.length; i++){
          document.form.test[i].checked = all;
        }
      }

      function　DisChecked(){
        var checks = document.form.test;
        var checksCount = 0;
        for (var i=0; i<checks.length; i++){
          if(checks[i].checked == false){
            document.form.all.checked = false;
          }else{
            checksCount += 1;
            if(checksCount == checks.length){
              document.form.all.checked = true;
            }
          }
        }
      }
</script>

@for ($i = 0; $i < 10; $i++){{$i}}
<div>
{{date('m-d',strtotime($i." day"))}}
<input type="checkbox" name="available_date" value="<?php echo date("Y-m-d", strtotime("{{$i}} day")) ?>">
<button onClick="AllChecked();">ALL Checked </button>
@for ($j = 0; $j < 25; $j++)
<input type="checkbox" name="{{date('Y-m-d',strtotime($i." day"))}}" value="{{$j}}">{{ $j }}:00
@endfor
</div> 

Answer 1

1. 实际上你不能通过PHP来控制动态用户的行为，因为PHP只能在服务器上工作，所以所有这类事情都是由javascript来管理的(如果我没理解错的话)
2. 不是100%确定的，但是你似乎不需要复选框和按钮对于javascript你可以用一个类来选择所有的复选框(为了简单起见，将用jquery显示示例)

// html
<input type="checkbox" class="all_checked" name="available_date" value="<?php echo date("Y-m-d", strtotime("{{$i}} day")) ?>">
@for ($j = 0; $j < 25; $j++)
<input type="checkbox" class="checkbox" name="{{date('Y-m-d',strtotime($i." day"))}}" value="{{$j}}">{{ $j }}:00
@endfor

// js
$('.all_checked').on('click', function () {
    const allCheckedCheckbox = $(this);
    $('.checkbox').each(function () {
        $(this).prop('checked', allCheckedCheckbox.prop('checked'));
    });
});

Answer 2

您可以使用jquery完成此操作。

只需在每个复选框中添加一个公共类

例如:- class=“复选框”

并编写js函数。

  function AllChecked(){
     $('.checkbox').attr("checked");
  }