TUGAS PEMROGRAMAN WEB VALIDASI

Validasi Data Menggunakan Javascript

Assalamualaikum wr. wb

Kali ini saya akan posting tugas tentang validasi data yang dibuat dengan HTML dan PHP supaya bisa menerima sebuah input data yg valid. Contoh jika kita mau menuliskan nama berarti kita haruh menginputkan huruf (tidak boleh angka), apabila salah dalam mengisi akan ada peringatan nantinya.

Nah Bagaimana caranya? Caranya kita harus menggunakan Javascript untuk bisa mengoreksi jika kita memasukan data yang tidak sesuai.

1.Tampilan sebelum diisi

 2.Ketika sudah diisi dgn benar lalu dikirim.

3.Apabila mengisi nama terdapat angka

4.Apabila mengisi nim terdapat huruf

5.Jika tidak mengisi Nama da Nim

6.Jika alamat tidak diisi

7.Jika Jenis Kelamin tidak dipilih

 

 Dibawah ini adalah script Javascript nya.

<script>
    function validasi(){
        var namaValid    = /^[a-zA-Z]+(([\'\,\.\- ][a-zA-Z ])?[a-zA-Z]*)*$/;
        var nimValid     = /^[0-9]+$/;
        var nama         = formulir.nama.value;
        var jeniskelamin = formulir.gender.value;
        var alamat       = formulir.alamat.value;
        var nim          = formulir.nim.value;
        var pesan = '';

        if (nama == '') {
            pesan += '!Namanya diisi Boss\n';
        }


        if (nama != '' && !nama.match(namaValid)) {
            pesan += '!Nama tidak valid\n';
        }

        if(nim==""){
            pesan += '!Nimnya diisi Boss\n';

        }

        if(!nim.match(nimValid)){
            pesan += '!Nim tidak valid\n';
        }

        if (alamat== ''){
            pesan += '!Alamatnya diisi Boss\n';
        }

        if (jeniskelamin == '') {
            pesan += '!Jenis kelamin harus dipilih\n';
        }

        if (pesan != '') {
            alert('Maaf Boss, ada kesalahan saat pengisian Formulir : \n'+pesan);
            return false;
        }
    return true
    }
</script>

Kemudian ini HTML nya

<html>
<head><title>Rahmad Kurniawan Aprizal</title></head>
<body>
<font face="snap ITC">
    <p align="center">FORM PENDAFTARAN</p>
<form name="formulir" action="ook.php" method="post" onSubmit="return validasi()">
    <table>
        <tr>
        <td>NAMA:</td>
        <td><input type="text" name="nama" placeholder="Your Name Boss" size=50></td><br>
        <tr>
            <td>NIM : </td><td><input type="text" name="nim" placeholder="Your NIM Boss" size=50></td>
        </tr>
        <tr>
            <td>ALAMAT : </td><td><textarea name=alamat placeholder="Alamat Sekarang Boss" cols=46 rows=5></textarea></td>
        </tr>
        <tr>
        <td>JENIS KELAMIN :</td>
        <td><select name="gender">
            <option value="">Pilih</option>
            <option value="laki-laki">Laki-Laki</option>
            <option value="perempuan">Perempuan</option>
        </select></td>
<tr>
        <td></td>
        <td><input type="submit" value="Kirim" name="submit"><input type="reset" value="Ulang" name="reset"></td>
    </tr>
</table>
</form>
</body>
</html>

Lalu PHP nya

<?php

$nama = $_POST['nama'];
$nim  = $_POST['nim'];
$alamat = $_POST['alamat'];
$gender = $_POST['gender'];

echo " Selamat datang " .$nama. " Nim anda adalah " .$nim. " Alamat anda di " .$alamat. " Jenis Kelamin anda " .$gender;
 ?>

Sekian dulu dari saya. Terima Kasih. :*

Wassalamualaikum wr.wb