Tugas Validasi Tatap Muka

 Bagaskoro Kuncoro Ardi

05111940000048


Berikut website validasi tatap muka yang saya buat





Website dapat diakses di link berikut

Source code:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Belajar Form Validation</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
</head>
<body>
<div class="container">
<form name="formPendaftaran" action="daftar.php" method="post" onsubmit="return validateForm()">
<div class="form-group">
<label>Nama</label>
<input type="text" name="nama" placeholder="Nama lengkap" class="form-control">
</div>
<div class="form-group">
<label>NRP</label>
<input type="text" name="nrp" placeholder="14-digit" class="form-control">
</div>
<div class="form-group">
<label>Jurusan</label>
<select name="jurusan" class="form-control">
<option value="0">Pilih Jurusan</option>
<option value="1">Jurusan Informatika</option>
<option value="2">Jurusan Teknik Komputer Jaringan</option>
<option value="3">Jurusan Multimedia</option>
</select>
</div>
<div class="form-group">
<label>Vaksin 1</label>
<select name="vaksin-1" class="form-control">
<option value="0">Pilih</option>
<option value="1">Sudah</option>
<option value="2">Belum</option>
</select>
</div>
<div class="form-group">
<label>Vaksin 2</label>
<select name="vaksin-2" class="form-control">
<option value="0">Pilih</option>
<option value="1">Sudah</option>
<option value="2">Belum</option>
</select>
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</form>
</div>
<script>
function validateForm() {
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 (document.forms["formPendaftaran"]["jurusan"].selectedIndex < 1) {
alert("Pilih Jurusan.");
document.forms["formPendaftaran"]["jurusan"].focus();
return false;
}
if (document.forms["formPendaftaran"]["vaksin-1"].selectedIndex < 1) {
alert("Pilih Vaksin 1.");
document.forms["formPendaftaran"]["vaksin-1"].focus();
return false;
}
if (document.forms["formPendaftaran"]["vaksin-2"].selectedIndex < 1) {
alert("Pilih Vaksin 2.");
document.forms["formPendaftaran"]["vaksin-2"].focus();
return false;
}
}
</script>
</body>
</html>


Komentar

Postingan populer dari blog ini

Tugas 1 PWEB