<div class="card">
	<div class="card-header">
		<h4>User's Update</h4>
	</div>
	<div class="card-body">
		<form id="form-update-barang" enctype="multipart/form-data" method="post"
			  action="<?= site_url("user/proses_update") ?>">
			<div class="form-group">
				<label for="nama-user">User's Name</label>
				<input value="<?= $user->nama_user ?>" required type="text" maxlength="20" name="nama" id="nama_user" class="form-control"/>
			</div>
			<div class="form-group">
				<label for="email-user">User's Email</label>
				<input value="<?= $user->email_user ?>" required type="text" name="email" id="email_user" class="form-control"/>
			</div>
			<div class="form-group">
                    <label for="">User's Role</label>
				<select name="role" id="" required class="form-control">
					<option value="<?=$user->role_user?>" disabled selected><?=$user->role_user?></option>
					<option value="Admin" value="<?= $user->role_user ?>">Admin</option>
					<option value="Kasir" value="<?= $user->role_user ?>">Cashier</option>
				</select>
            </div>
			<input type="hidden" name="id"  value="<?= $user->id_user ?>" />
		</form>
	</div>
	<div class="card-footer">
		<button id="btn-save-barang" type="button" class="btn btn-success">
			<i class="fas fa-save"></i> Save
		</button>
	</div>
</div>
<script>
    $(function () {
        $("#btn-save-barang").on("click", function () {
            let validate = $("#form-update-barang").valid();
            if(validate){
                $("#form-update-barang").submit();
			}
        });
        $("#form-update-barang").validate({
            rules: {
                kode: {
                    alphanumeric: true
                },
                harga: {
                    digits: true
                },
                stock: {
                    digits: true
                }
            },
            messages: {
                kode: {
                    alphanumeric: "Hanya Boleh Angka, Huruf dan Undescore"
                }
            },
            errorElement: 'span',
            errorPlacement: function (error, element) {
                error.addClass('invalid-feedback');
                element.closest('.form-group').append(error);
            },
            highlight: function (element, errorClass, validClass) {
                $(element).addClass('is-invalid');
            },
            unhighlight: function (element, errorClass, validClass) {
                $(element).removeClass('is-invalid');
            }
        });
    });
</script>