多个开关单选按钮，所有按钮仅切换一个开关

Question

我要美化许多不同的复选框开关。我将出色的pretty checkboxes css库添加到了我的项目中，并按下面的代码所示实现了它。它会正确显示所有检查的值和图形，但是单击任何按钮都只会打开或关闭最后一个复选框。

<div class="pretty p-switch p-fill" style="display: grid; grid-template-columns: repeat(5,1fr); grid-column-gap: 10px; grid-row-gap: 6px;">

@foreach($portalnames as $portalname)
    @if($loop->index == 0 || $loop->index == 1 || $loop->index == 37 || $loop->index == 38) @continue @endif
    <li>
        <input type="checkbox" name="{{$portalname}}" id="{{$portalname}}" @if($portals->$portalname == 1) checked @endif>
        <div class="state p-success">
            <label>{{$portalname}}</label>
        </div>
   </li>
{{-- @if( (($loop->index)-1)%7 == 0) --}}
    {{-- </div> --}}
{{-- @if ($loop->index != 36)
    <div class="col-md-2">
@endif --}}
{{-- @endif  --}}
@endforeach
</div>