Validasi Email dengan JavaScript

Tabel Konten
  1. Pembaharuan 
/*
Created by: Anita Sudhakar :: http://www.smartwebby.com/DHTML/email_validation.asp
*/
function echeck(str) {
    var at = "@";
    var dot = ".";
    var lat = str.indexOf(at);
    var lstr = str.length;
    var ldot = str.indexOf(dot);
    if (str.indexOf(at) == -1) {
        alert("ID Email tidak valid!");
        return false;
    }
    if (str.indexOf(at) == -1 || str.indexOf(at) == 0 || str.indexOf(at) == lstr) {
        alert("ID Email tidak valid!");
        return false;
    }
    if (str.indexOf(dot) == -1 || str.indexOf(dot) == 0 || str.indexOf(dot) == lstr) {
        alert("ID Email tidak valid!");
        return false;
    }
    if (str.indexOf(at, (lat + 1)) != -1) {
        alert("ID Email tidak valid!");
        return false;
    }
    if (str.substring(lat - 1, lat) == dot || str.substring(lat + 1, lat + 2) == dot) {
        alert("ID Email tidak valid!");
        return false;
    }
    if (str.indexOf(dot, (lat + 2)) == -1) {
        alert("ID Email tidak valid!");
        return false;
    }
    if (str.indexOf(" ") != -1) {
        alert("ID Email tidak valid!");
        return false;
    }
    return true;
}

function ValidateForm() {
    var emailID = document.frmSample.txtEmail;

    if ((emailID.value == null) || (emailID.value == "")) {
        alert("Ketik alamat email Anda!");
        emailID.focus();
        return false;
    }
    if (echeck(emailID.value) == false) {
        emailID.value = "";
        emailID.focus();
        return false;
    }
    return true;
}
<form name='frmSample' method='post' action='#' onSubmit='return ValidateForm()'>
Masukkan alamat email: 
    <input type='text' name='txtEmail' /> 
    <input type='submit' name='submit' value='Submit' />
</form>

Lihat Demo

Pembaharuan 

Filter yang lebih sederhana dengan regex dari Dynamic Drive:

/*
 * Email Validation script - © Dynamic Drive (www.dynamicdrive.com)
 * This notice must stay intact for legal use.
 * Visit http://www.dynamicdrive.com/ for full source code
 */

var emailfilter = /^\w+[\+\.\w\-]*@([\w\-]+\.)*\w+[\w\-]*\.([a-z]{2,4}|\d+)$/ig;

function checkmail(e) {
    var checkval = emailfilter.test(e.value);
    if (checkval == false) {
        alert("ID Email tidak valid!");
        e.select();
    }
    return checkval;
}
<form name='taufik'>
    <input name='prikitiwform' type='text' />
    <input type='submit' onClick='return checkmail(this.form.prikitiwform)' value='Submit' />
</form>

Lihat Demo

5 Komentar

  • Putra

    mas kalo semisal targetnya itu bukan atribute name, tapi atribut namenya itu ada titiknya (entry.221604029), kalo itu diganti malah gak jalan proses submitnya (bukan proses scriptnya) mas :'(
    sebelumnya jg nyoba dr komentar mas taufik di 2012/07/beberapa-pola-regex-bermanfaat.html, tapi sewaktu dipencet submitnya malah katut terkirim mas

  • Taufik Nurrohman

    var target = document.forms[0]['entry.221604029'];
  • Putra

    itu digimanain mas? sy coba pasang kyk gini
    <!-- inputnya -->
    <input required="true" name="entry.221604029" placeholder="Your email address to contact you back." value="" id="entry_221604029" type="text"/>

    <!-- submitnya -->
    <button name="submit" value="Send" id="ss-submit" onClick="return checkmail();" type="submit">Send</button>

    <!-- scriptnya -->
    <script type="text/javascript">
    //<![CDATA[
    var emailfilter = /^\w+[\+\.\w\-]*@([\w\-]+\.)*\w+[\w\-]*\.([a-z]{2,4}|\d+)$/ig;

    function checkmail(e) {
    var target = document.forms[0]['entry.221604029'];
    var checkval = emailfilter.test(e.value);
    if (checkval == false) {
    alert("Email tidak valid!");
    e.select();
    }
    return checkval;
    }
    //]]>
    </script>

    gak jalan mas scriptnya, apa ak salah nempatin atau gimana mas? hehe disini

  • Taufik Nurrohman

    var target = document.getElementsByName('entry.221604029');
    if (!target[0] || !emailfilter.test(target[0].value)) { … }

    Pakai fitur HTML5 saja lebih gampang mas, dan tidak memerlukan JavaScript. Pilihannya ada dua:

    <input type="email">
    <input type="text" pattern="^\w+[\+\.\w\-]*@([\w\-]+\.)*\w+[\w\-]*\.([a-zA-Z]{2,4}|\d+)$">
  • Putra

    wah simple ya ternyata kalo pake html5, baru tahu, okee makasih banyak mas taufik :-bd

Komentar telah ditutup.