Home » , » Validasi form dengan javascript

Validasi form dengan javascript

Pada Kesempatan kali ini saya akan coba sedikit paparkan tentang bagaimana cara validasi input form login dengan javascript....

Alurnya nya kaya gini, ibaratkan kita akan login pada sutu aplikasi dimana untuk login mengambil data email dan password yang telah kita input sebelum-nya pada saat register!!!

Yang dimana javascript ini i fungsukan untuk memvalidasi form login tidak boleh kosong dan email serta password kita cocokan denagan inputan pada database jika inputan kosong atau tidak sesuai maka akan muncul peringatan dan akan diminta kembali   untuk login.....
1. form login.php
<form action="prosesLogin.php" method="post" onSubmit="return validasiForm(this)">
                        <table>      
                            <tr>
                                <td><label>Email Anda</label></td>
                                <td><input type="text" name="email"/></td>
                            </tr>
                            <tr>
                                <td><label>Password</label></td>
                                <td><input type="password" name="pass"/></td>
                            </tr>
                                <td colspan="2" height="30">
                                    <input type="submit" name="tombolrequest" value="Login" />
                                </td>
                            </tr>
                        </table>
                    </form>
2. tambahkan pada <head>
<script type="text/javascript" src="checkLogin.js"></script>
3. File Kedua ProsesLogin.php
<?php
    session_start();
    // koneksi ke database
    include "koneksiDatabase.php";
    $email = $_POST['email'];
    $pass  = md5($_POST['pass']);
    $koneksi = koneksi_db();
    $sql      = "select * from member where email='$email' and katasandi='$pass'";
    $query      = mysql_query($sql,$koneksi);
    $cekAda  = mysql_num_rows($query);
    $f          = mysql_fetch_array($query);
    if ($cekAda == 0) {
        echo "<script language='javascript'>alert('Maaf Anda belum terdaftar menjadi member!');</script>";
            echo "<script language='javascript'>window.location = '../login.php'</script>";
        }else{
            session_register("email","pass","id_member");
            $_SESSION['email'] = $email;
            $_SESSION['pass'] = $pass;
            $_SESSION['id_member'] = $f['id_member'];
            echo "<script language='javascript'>window.location = '../index.php'</script>";
        }
?>

4. Validasi dengan java sciptnya!! save dengan file checkLogin.js
function validasiForm(LoginForm){
    var reason = "";
    reason += validasiEmail(LoginForm.email);
    reason += validasiPass(LoginForm.pass);
    if(reason != ""){
        alert("Kesalahan Input data pada : \n\n" + reason);
        return false;
    }
        return true;
    }

function validasiEmail(jaja99){
    var error = "";
    var filter = /^[a-zA-Z0-9]+[a-zA-Z0-9_.-]+[a-zA-Z0-9_-]+@[a-zA-Z0-9]+[a-zA-Z0-9.-]+[a-zA-Z0-9]+.[a-z]{2,4}$/;
    var isi_email = jaja99.value;
    if(jaja99.value == ""){
        jaja99.style.background = '#B8ECF5';
        error = "Nama Email Anda belum di isi ! \n";
        }else if(filter.test(isi_email) == false){
            jaja99.style.background = '#B8ECF5';
            error = "Email Anda tidak Valid ! \n";
        }else{
            jaja99.style.background = 'white';
        }
        return error;
    }

function validasiPass(jaja99){
    var error = "";
    var panjangJudul = jaja99.value;
    if(jaja99.value==""){
        jaja99.style.background = '#B8ECF5';
        error = "Password belum Anda masukan ! \n";
    }else{
        jaja99.style.background = '#FFFFFF';
    }
    return error;
}

Terima Kasih Selamat Mencoba!!!

0 komentar :

Posting Komentar

-- POPULAR POST --

Like us on Facebook
Follow us on Twitter
Recommend us on Google Plus