EEB12/index.html

## index.html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="style.css" rel="stylesheet" type="text/css">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet"
        integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
    <link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet">
    <title>Form Pendaftaran</title>
</head>
<body>
    <nav class="navbar sticky-top navbar-dark bg-success bg-gradient py-3">
        <div class="container-fluid d-flex justify-content-center">
            <a class="navbar-brand fs-3 font-monospace" href="index.html">Form Validasi Vaksin Mahasiswa FTEIC</a>
        </div>
    </nav>

    <div class="bg-light bg-gradient container mx-auto my-4 border border-secondary rounded-3 shadow col-6">


    <form name="formPendaftaran" action = "./welcome.html" method="post" onsubmit="return validateForm()">
        <div class="form-group m-2">
            <label > Email</label>
            <input type="email" name = "email" class = "form-control"  class="form-control mt-1" placeholder="Email aktif" minlength="5"maxlength="50">
        </div>

        <div class="form-group m-2">
            <label>No Handphone</label>
            <input type="text" name="handphone" placeholder="No Handphone" class="form-control mt-1" minlength="5"
                maxlength="15" >
        </div>

        <div class="form-group m-2">
            <label> Password</label><br>
            <input type="password" name = "password" class="form-control mt-1" placeholder="Password">
        </div>

        <div class="form-group m-2">
            <label> Nama</label><br>
            <input type="text" name = "nama"  class="form-control mt-1" placeholder="Nama Lengkap">
        </div>

        <div class="form-group m-2">
            <label> NRP</label><br>
            <input type="text" name = "nrp" class="form-control mt-1" placeholder="0xxx">
        </div>

        <div class="form-group m-2">
            <label>Departemen</label>
            <select name="departemen" class="form-control form-select mt-1">
                <option selected>Pilih Departemen</option>
                <option value="1">Departemen Teknik Elektro</option>
                <option value="2">Departemen Teknik Biomedik</option>
                <option value="3">Departemen Teknik Komputer</option>
                <option value="4">Departemen Teknik Informatika</option>
                <option value="5">Departemen Sistem Informasi</option>
                <option value="6">Departemen Teknologi Informasi</option>

            </select>
        </div>

        <div class="form-group m-2">
            <label>Alamat Domisili</label>
            <input type="text" name="alamat" placeholder="Alamat Domisili" class="form-control mt-1" minlength="10"
                maxlength="50" >
        </div>

        <div class="form-group m-2">
            <label>Status Vaksin</label>
            <select name="vaksin" class="form-control form-select mt-1">
                <option selected>Pilih Status Vaksin</option>
                <option value="1">Belum Vaksin</option>
                <option value="2">Vaksin 1</option>
                <option value="3">Vaksin 2</option>
            </select>
        </div>


        <input type="submit" style="background-color: #4CAF50;padding: 12px 12px; width: 100% ;color: white; margin: 4px 2px;
        cursor: pointer;" value = "sign up">
    </form>
</div>
</body
>

<script>
    function isNumeric(str) {
        if (typeof str != "string") return false // we only process strings!
        return !isNaN(str) &&
            // use type coercion to parse the _entirety_ of the string (`parseFloat` alone does not do this)...
            !isNaN(parseFloat(str)) // ...and ensure strings of whitespace fail
    }

    function validateForm() {
        if (document.forms["formPendaftaran"]["email"].value == "") {
            alert("Email Tidak Boleh Kosong");
            document.forms["formPendaftaran"]["email"].focus();
            return false;
        }
        if (!isNumeric(document.forms["formPendaftaran"]["handphone"].value)) {
            alert("no hp harus berisi angka");
            document.forms["formPendaftaran"]["handphone"].focus();
            return false;
        }
        if (document.forms["formPendaftaran"]["password"].value == "") {
            alert("Password Tidak Boleh Kosong");
            document.forms["formPendaftaran"]["password"].focus();
            return false;
        }
        if (document.forms["formPendaftaran"]["nama"].value == "") {
            alert("Nama Tidak Boleh Kosong");
            document.forms["formPendaftaran"]["nama"].focus();
            return false;
        }

        if (document.forms["formPendaftaran"]["nrp"].value == "") {
            alert("NRP Tidak Boleh Kosong");
            document.forms["formPendaftaran"]["nrp"].focus();
            return false;
        }

        if (!isNumeric(document.forms["formPendaftaran"]["nrp"].value)) {
            alert("NRP harus berisi angka");
            document.forms["formPendaftaran"]["nrp"].focus();
            return false;
        }

        if (document.forms["formPendaftaran"]["departemen"].selectedIndex < 1) {
            alert("Pilih Departemen.");
            document.forms["formPendaftaran"]["departemen"].focus();
            return false;
        }
        if (document.forms["formPendaftaran"]["domisili"].value == "") {
            alert("Masukkan Domisili anda saat ini");
            document.forms["formPendaftaran"]["domisili"].focus();
            return false;
        }
        if (document.forms["formPendaftaran"]["vaksin"].selectedIndex < 1) {
            alert("Pilih Status Vaksin.");
            document.forms["formPendaftaran"]["vaksin"].focus();
            return false;
        }

    }
</script>
</html>
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<link href="style.css" rel="stylesheet" type="text/css">
	<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet"
	integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
	<link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet">
	<title>Form Pendaftaran</title>
	</head>
	<body>
	<nav class="navbar sticky-top navbar-dark bg-success bg-gradient py-3">
	<div class="container-fluid d-flex justify-content-center">
	<a class="navbar-brand fs-3 font-monospace" href="index.html">Form Validasi Vaksin Mahasiswa FTEIC</a>
	</div>
	</nav>

	<div class="bg-light bg-gradient container mx-auto my-4 border border-secondary rounded-3 shadow col-6">


	<form name="formPendaftaran" action = "./welcome.html" method="post" onsubmit="return validateForm()">
	<div class="form-group m-2">
	<label > Email</label>
	<input type="email" name = "email" class = "form-control" class="form-control mt-1" placeholder="Email aktif" minlength="5"maxlength="50">
	</div>

	<div class="form-group m-2">
	<label>No Handphone</label>
	<input type="text" name="handphone" placeholder="No Handphone" class="form-control mt-1" minlength="5"
	maxlength="15" >
	</div>

	<div class="form-group m-2">
	<label> Password</label><br>
	<input type="password" name = "password" class="form-control mt-1" placeholder="Password">
	</div>

	<div class="form-group m-2">
	<label> Nama</label><br>
	<input type="text" name = "nama" class="form-control mt-1" placeholder="Nama Lengkap">
	</div>

	<div class="form-group m-2">
	<label> NRP</label><br>
	<input type="text" name = "nrp" class="form-control mt-1" placeholder="0xxx">
	</div>

	<div class="form-group m-2">
	<label>Departemen</label>
	<select name="departemen" class="form-control form-select mt-1">
	<option selected>Pilih Departemen</option>
	<option value="1">Departemen Teknik Elektro</option>
	<option value="2">Departemen Teknik Biomedik</option>
	<option value="3">Departemen Teknik Komputer</option>
	<option value="4">Departemen Teknik Informatika</option>
	<option value="5">Departemen Sistem Informasi</option>
	<option value="6">Departemen Teknologi Informasi</option>

	</select>
	</div>

	<div class="form-group m-2">
	<label>Alamat Domisili</label>
	<input type="text" name="alamat" placeholder="Alamat Domisili" class="form-control mt-1" minlength="10"
	maxlength="50" >
	</div>

	<div class="form-group m-2">
	<label>Status Vaksin</label>
	<select name="vaksin" class="form-control form-select mt-1">
	<option selected>Pilih Status Vaksin</option>
	<option value="1">Belum Vaksin</option>
	<option value="2">Vaksin 1</option>
	<option value="3">Vaksin 2</option>
	</select>
	</div>





	<input type="submit" style="background-color: #4CAF50;padding: 12px 12px; width: 100% ;color: white; margin: 4px 2px;
	cursor: pointer;" value = "sign up">
	</form>
	</div>
	</body
	>

	<script>
	function isNumeric(str) {
	if (typeof str != "string") return false // we only process strings!
	return !isNaN(str) &&
	// use type coercion to parse the _entirety_ of the string (`parseFloat` alone does not do this)...
	!isNaN(parseFloat(str)) // ...and ensure strings of whitespace fail
	}

	function validateForm() {
	if (document.forms["formPendaftaran"]["email"].value == "") {
	alert("Email Tidak Boleh Kosong");
	document.forms["formPendaftaran"]["email"].focus();
	return false;
	}
	if (!isNumeric(document.forms["formPendaftaran"]["handphone"].value)) {
	alert("no hp harus berisi angka");
	document.forms["formPendaftaran"]["handphone"].focus();
	return false;
	}
	if (document.forms["formPendaftaran"]["password"].value == "") {
	alert("Password Tidak Boleh Kosong");
	document.forms["formPendaftaran"]["password"].focus();
	return false;
	}
	if (document.forms["formPendaftaran"]["nama"].value == "") {
	alert("Nama Tidak Boleh Kosong");
	document.forms["formPendaftaran"]["nama"].focus();
	return false;
	}

	if (document.forms["formPendaftaran"]["nrp"].value == "") {
	alert("NRP Tidak Boleh Kosong");
	document.forms["formPendaftaran"]["nrp"].focus();
	return false;
	}

	if (!isNumeric(document.forms["formPendaftaran"]["nrp"].value)) {
	alert("NRP harus berisi angka");
	document.forms["formPendaftaran"]["nrp"].focus();
	return false;
	}

	if (document.forms["formPendaftaran"]["departemen"].selectedIndex < 1) {
	alert("Pilih Departemen.");
	document.forms["formPendaftaran"]["departemen"].focus();
	return false;
	}
	if (document.forms["formPendaftaran"]["domisili"].value == "") {
	alert("Masukkan Domisili anda saat ini");
	document.forms["formPendaftaran"]["domisili"].focus();
	return false;
	}
	if (document.forms["formPendaftaran"]["vaksin"].selectedIndex < 1) {
	alert("Pilih Status Vaksin.");
	document.forms["formPendaftaran"]["vaksin"].focus();
	return false;
	}

	}
	</script>
	</html>