Laravel 实时计算选中的复选框

Question

你们好。如何实时统计选中的复选框？我将这些按钮标记为 转学生，我希望用户知道有多少学生当前已检查（因为我们的教室对大小敏感）

  <button   
    wire:click="editModal()"
        class="bg-blue-500 hover:bg-blue-300 text-white font-bold py-2 px-4 border-b-4 border-blue-700 hover:border-blue-500 rounded">
        Transfer Student($count of selected students) 
      </button>

 <input type="checkbox" wire:model="selectedStudents.{{ $stud->id }}">

Answer 1

我会改变你跟踪你的方式 selectedStudents 让事情变得更容易一些。

您当前对 selectedStudents.{{ $stud->id }} 的实现会生成一个数组，其中 key 是 student id 并且 value 也是 student id（当selected) 或 false 未 selected。选择然后取消select复选框不会删除数组元素，而是将其 value 设置为 false.

因此，如果您将 Livewire 绑定到 selectedStudents 数组，然后使用 input 元素的 value 属性，您可以获得类似但简化的结果。

<input type="checkbox" wire:model="selectedStudents" value="{{ $stud->id }}" />

上面的结果是一个数字索引数组，其中 value 是 student id。当您 select 一个复选框时，一个元素被添加到 selectedStudents 并且当您取消 select 一个复选框时，它被删除。

这样做的好处是，您现在可以简单地使用 count($selectedStudents) 来获取 selected 的学生人数。

{{ count($selectedStudents) }} have been selected

Laravel 实时计算选中的复选框

Laravel Count Checked Checkbox Real-Time

laravel

laravel-livewire