Bagiamana cara memberikan fungsi onclick() dan onload() secara bersamaan

Halo suhu suhu semua, saya ingin bertanya. Jadi saya hendak membuat aplikasi untuk monitoring pekerjaan, lalu untuk input nya saya menggunakan checkbox. Nah untuk validasi, saya menggunakan nilai inputan dari ckb1 sebagai require agar ckb2 juga dapat dimasukkan kedalam database. Sedangkan ckb1 nilai valuenya tidak dimasukkan ke database. Berikut code untuk bagian controllernya

<?php

namespace App\Http\Controllers;

use App\Models\Task;
use Illuminate\Auth\Events\Validated;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\DB;
use Illuminate\Support\Facades\Validator;
use phpDocumentor\Reflection\Types\Null_;

class MonitoringController extends Controller
{
    public function index(Request $request)
    {
        $task = DB::table('tasks')->get();

        return view('dashboard', ['task' => $task]);
    }
    protected function validator($data)
    {
        return Validator::make($data, [
            'ckb1' => 'required', 'integer', 'max:30',
            'ckb2' => 'required', 'integer', 'max:30',
        ]);
    }

    public function store(Request $request)
    {
        $ckb1 = $request->ckb1;
        $ckb2 = $request->ckb2;
        $validator = Validator::make($request->all(), [
            'ckb1' => 'required', 'integer', 'max:30',
        ]);

        if ($validator->fails()) {
            return redirect('/dashboard')->with([
                'warning' => 'Task sebelumnya harus di isi'
            ]);
        }

        $ckb1 = DB::table('tasks')->get();
        if ($ckb1) {
            $ckb1 = Task::create([
                'ckb1' => $request->ckb1
            ]);
        }
        $ckb2 = DB::table('tasks')->where('ckb1', $ckb1->ckb1)->latest()->first();
        if ($ckb2) {
            $ckb2 = DB::table('tasks')->where('ckb1', $request->ckb1)->update([
                'ckb2' => $request->ckb2
            ]);
            if ($ckb2) {
                return redirect('/dashboard')->with([
                    'success' => 'Berhasil dimasukkan'
                ]);
            }
        } else {
            return redirect('/dashboard')->with([
                'warning' => 'Harap Tunggu Task Sebelumnya'
            ]);
        }
    }
}

kemudian, saya hendak melakukan disable ketika ckb1 sudah melakukan checked. Akan tetapi, ketika page di refresh maka ckb1 tersebut ter reset atau dapat di input ulang. Berikut code untuk blade dan javascript nya

<x-app-layout>
    <x-slot name="header">
        <h2 class="font-semibold text-xl text-gray-800 leading-tight">
            {{ __('Dashboard') }}
        </h2>
        @if ($message = Session::get('warning'))
        <div class="alert alert-warning alert-block">
            <button type="button" class="close" data-dismiss="alert">×</button>
            <strong>{{ $message }}</strong>
        </div>
        @endif
        @if ($message = Session::get('success'))
        <div class="alert alert-success alert-block">
            <button type="button" class="close" data-dismiss="alert">×</button>
            <strong>{{ $message }}</strong>
        </div>
        @endif
    </x-slot>

    <h2>SMA Negeri 1 Salatiga</h2>

    <table style="width:100%">
        <tr>
            <th>Marcomn</th>
            <th>Data Agent</th>
            <th>Data Entry</th>
        </tr>

        <tr>
            <td>
                <form method="POST" action="/das" enctype="multipart/form-data">
                    @csrf

                    <input type="checkbox" id="ckb1" class="input-checkbox100" name="ckb1" value="1">
                    <label class="label-checkbox100" for="ckb1">
                        Menunggu Data
                    </label>
            </td>
            <td>
                <input type="checkbox" onChange="this.form.submit()" id="ckb2" class="input-checkbox100" name="ckb2" value="2">
                <label class="label-checkbox100" for="ckb2">
                    Input Data
                </label>
            </td>
            <td><input class="input-checkbox100" id="ckb3" type="checkbox" name="ckb3">
                <label class="label-checkbox100" for="ckb3">
                    Open PO
                </label>
            </td>
            </form>
        </tr>
        <script>
            function prepareEventHandlers(){
                var checkBox = document.getElementById('ckb1');
                checkBox.onclick = function() {
                    if (checkBox.checked == true ) {
                        checkBox.disabled = true;
                    } else {
                        alert('error gobloooooo');
                    }
                }
            }
            window.onload = function(){
                prepareEventHandlers();
            }
        </script>

    </table>
    <!-- <script>
    function myFunction(){
        var data = document.getElementById('data');
        console.log(data);
    }
</script> -->

</x-app-layout>

saya akali dengan menggunakan function onload. Akan tetapi, ketika web di refresh maka hasilnya tetap ter reset, atau ckb 1 dapat diinput ulang, tidak ke disable. Kira kira bagaimana caranya untuk memasukkan fungsi onclick dan onload secara bersamaan ? terimakasih suhu suhu semua