Selasa, 10 Januari 2017

Membuat Validasi Menggunakan Javascript dan Html


Halo sobat sandal sekalian !!!

     Kali ini saya akan membahas sesuatu yang berbau dengan script web yaitu Html dan Javascript. Bahasa pemograman web ada 4 bahasa yang digunakan di web sebagai berikut


  1. HTML
  2. CSS
  3. JAVASCRIPT
  4. PHP
         Dari 4 bahasa tersebut saling berhubungan antara bahasa 1 dengan bahasa lainnya jadi jika kalian ingin jadi web desain kalian harus bisa mengusai 4 bahasa tersebut. Tapi kali ini kita akan lebih fokus ke HTML dan JAVASCRIPT karena kita membuat validasi kalau diibaratkan dalam kehidupan sehari-hari validasi itu seperti ada orang lain bertanya siapa nama anda akan tetapi anda tidak menjawab maka di akan memberi peringatan kepada kamu yang menegaskkan apa yang ditanya tadi. secara umum validasi adalah suatu tindakan yang membuktikan bahwa suautu proses/metode dapat memberikan hasil yang konsisten sesuai dengan spesifikasi yang telah di tetapkan dan terdokumentasi dengan baik berikut contoh validasi :



Apakah harus ada validasi dalam pendafaran, login dan sebagainnya? ya, harus ada karena menekan ke pengguna untuk mengisi untuk melanjutkan ke tahap selanjutnya, berikut script kode sederhana untuk validasi.


NOTE : simpan kode berikut dengan nama "formulir.html" tanpa tanda petik


<html>
<head>
<title>Formulir</title>
<script type="text/javascript">
function validasi ()
{
var Nama=document.pendaftaran.Nama.value;
var Tempat=document.pendaftaran.Tempat.value;
if (Nama=="")
{alert("Nama harus diisi");}
if (Tempat=="")
{alert("Tempat harus diisi");}
}
</script>
</head>
<body>
<center><h1>Formulir Pendaftaran</h1></center>
<center><table border="0" width="400">
<form name="pendaftaran" action="" method="post" >
<tr>
<td>Nama</td>
<td>:</td>
<td><input type="text" name="Nama" size="25"></td>
</tr>
<tr>
<td>Tempat</td>
<td>:</td>
<td><input type="text" name="Tempat" size="25"></td>
</tr>
<tr>
<td>Tanggal Lahir</td>
<td>:</td>
<td><input type="date" name="Tanggal Lahirr" size="25">/
</tr>
<tr>
<td>Jenis Kelamin</td>
<td>:</td>
<td><input type="radio" name="Gender" value="Laki-laki" checked>Laki-Laki<br>
<input type="radio" name="Gender" value="Perempuan"
checked>Perempuan</td>

<tr>

<td>Hobby</td>
<td>:</td>
<td> <input type="checkbox" value="">Football
<input type="checkbox" value="">Traveling
<input type="checkbox" value="">Blogging<br>
<input type="checkbox" value="">Music
<input type="checkbox" value="">Adventure
<input type="checkbox" value="">Lainnya
</td>
</tr>
<tr>
<td>Warna Favorit</td>
<td>:</td>
<td><input type="color" name="Warna">
</tr>
<center>
<tr align="center">
<td><button type="submit" onclick="validasi()">Simpan</button>
<input type="reset" name="cancel"></td>
</tr>
</center>
</table></center></form>
</body>
</html>

nah kode ini javascript ini yang membuat validasinya :

<script type="text/javascript">
function validasi ()
{
var Nama=document.pendaftaran.Nama.value;
var Tempat=document.pendaftaran.Tempat.value;
if (Nama=="")
{alert("Nama harus diisi");}
if (Tempat=="")
{alert("Tempat harus diisi");}
}
</script>

Mungkin itu saja yang bisa saya bagikan untuk hari semoga bermanfaat bagi anda semua sekian dan terimakasih

Tidak ada komentar:

Posting Komentar