JSFiddle - React, Tailwind, and code Playground

by aanred

HTML

<form name="myForm" method="post" action="nonuum_reg.php" onsubmit="validate(event);">
    IC Number: <br />
    <input name="ic" type="text" id="ic" maxlength="12" size="45" onkeypress='validateNum(event)'/><br />
    Email:<br />
    <input name="mail" id="mail" type="text" /><br />
    <input type="submit" value="Apply" />
</form>

JavaScript

function validateNum(evt) {
    var theEvent = evt;
    var key = theEvent.keyCode || theEvent.which;
    key = String.fromCharCode( key );
    var regex = /[0-9]|\./;
    
    if( !regex.test(key) ) {
        theEvent.returnValue = false;
        if(theEvent.preventDefault) theEvent.preventDefault();
    }
}

function validate(evt){
    
    if( document.myForm.ic.value == "" || isNaN( document.myForm.ic.value ) || document.myForm.ic.value.length != 12) {
        
        evt.preventDefault();
        
        alert( "Please provide your correct IC Number!" );
        document.myForm.ic.focus() ;
        return false;
    } 
    
    var emailID = document.myForm.mail.value; 
    atpos = emailID.indexOf("@"); 
    dotpos = emailID.lastIndexOf("."); 
    
    if (atpos < 1 || ( dotpos - atpos < 2 )) { 
        evt.preventDefault();
        
        alert("Please enter correct email ID");
        document.myForm.mail.focus() ; 
        return false; 
    } 
}