Tugas Validasi Tatap Muka
Bagaskoro Kuncoro Ardi
05111940000048
Berikut website validasi tatap muka yang saya buat
Website dapat diakses di link berikut
Source code:
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!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
Posting Komentar