user_list.blade.php

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>User List</title>
    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-9ndCyUaIbzAi2FUVXJi0CjmCapSmO7SnpJef0486qhLnuZ2cdeRhO02iuK6FUUVM" crossorigin="anonymous">
</head>
<body>

    <div class="container mt-3">

        <h2>Tambah User Baru</h2>
        <form action="/user/add" method="POST">
            @csrf
            <div class="mb-3 col-6">
                <label for="name">Nama</label>
                <input class="form-control" type="text" id="name" placeholder="Nama Lengkap" name="name" required>
            </div>
            <div class="mb-3 col-6">
                <label for="email">Email</label>
                <input class="form-control" type="email" id="email" placeholder="Alamat Email" name="email" required>
            </div>
            <div class="mb-3 col-6">
                <label for="password">Password</label>
                <input class="form-control" type="password" id="password" placeholder="Masukkan Password" name="password" onkeyup=validatePassword() required>
            </div>
            <div class="mb-3 col-6">
                <label for="password2">Konfirmasi Password</label>
                <input class="form-control" type="password" id="password2" placeholder="Masukkan Password Kembali" name="password2" onkeyup=validatePassword() required>
            </div>
            <div class="mb-3 col-6">
                <input class="btn btn-primary" type="submit" id="submitform" value="Tambahkan" name="submit">
            </div>

        </form>

        <hr>

        <h2>Daftar User</h2>
        <table class="table table-striped">
            <thead>
                <tr>
                    <th>Nama</th>
                    <th>Email</th>
                    <th>Password</th>
                    <th></th>
                </tr>
            </thead>

            <tbody>

            @foreach ($users as $user)

                <tr>
                    <td>{{ $user->name }}</td>
                    <td>{{ $user->email }}</td>
                    <td>{{ $user->password }}</td>
                    <td>
                        <a href="/user/edit/form/{{$user->id}}"
                            class="btn btn-warning">
                            Edit
                        </a>
                        <a href="/user/delete/{{$user->id}}"
                            class="btn btn-danger"
                            onclick="confirm('Anda yakin ingin menghapus user {{$user->name}}?')">
                            Delete
                        </a>
                    </td>
                </tr>

            @endforeach

            </tbody>
        </table>

    </div>

    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-geWF76RCwLtnZ8qwWowPQNguL3RmwHVBC9FhGdlKrxdiJJigb/j/68SIy3Te4Bkz" crossorigin="anonymous"></script>
    <script>
        const password1 = document.getElementById('password')
        const password2 = document.getElementById('password2')
        const submitButton = document.getElementById('submitform')

        function validatePassword(){
            if(password1.value !== password2.value){
                submitButton.disabled = true
            } else {
                submitButton.disabled = false
            }
        }

    </script>
</body>
</html>