Member Avatar for vizz 
<form  method="post" name="myForm">

    <span class="formError email">Please Enter Valid Email</span>

    <input type="text" name="Email" id="email" />

    <input type="submit" value="Send" name="submitButton" />
</form>

.formError{  display:none; }

script 1

   var email = $("#email").val();

    if(email=='')
        {           
            $('.email').fadeOut(200).show();

        }

script 2

var x=document.forms["myForm"]["email"].value;
var atpos=x.indexOf("@");
var dotpos=x.lastIndexOf(".");
if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length)
  {
  alert("Not a valid e-mail address");
  return false;
  }

How to combine script 1 and script 2 with,

 if(email=='' || )
 {

 }
Edited by vizz
  • 3 Contributors
  • 4 Replies
  • 1K Views
  • 6 Hours Discussion Span
  • Latest Post Latest Post by vizz
Member Avatar for Bachu

Try This

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Form -  validate - Exg</title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<form  method="post" name="myForm">

    <span class="formError email">Please Enter Valid Email</span>

    <input type="text" name="Email" id="email" onKeyUp="checkEmail()" />

    <input type="submit" value="Send" name="submitButton" />
</form>
<style>
.formError{  display:none; }
</style>
<script type="text/javascript">
function checkEmail(){  
   var email = $("#email").val();
    var atpos=email.indexOf("@");
    var dotpos=email.lastIndexOf(".");
    if(email=='') $('.email').show();
    else if (atpos<1 || dotpos<atpos+2 || dotpos+2>=email.length)  $('.email').show();
    else $('.email').hide()
}

</script>
</body>
</html>
Member Avatar for vizz

Thanks

It's working well, But how to modify for following code?
if(name=='' || email=='' || subject=='' || message=='')
    {

        if(name=='')
        {           
            $('.name').fadeOut(200).show();
        }               
        if (email=='' )                 
        {           
            $('.email').fadeOut(200).show();                
        }           
        if(subject=='')
        {           
            $('.subject').fadeOut(200).show();
        }           
        if(message=='')
        {           
            $('.message').fadeOut(200).show();
        }


    }

    else
        {
            //ajax form submit
        }

How to validate email field for this code? If not valid email ID then do not submit form.

Member Avatar for pritaeas

I'd use the following construct:

function isValidEmail() {
  var x = document.forms["myForm"]["email"].value;
  var atpos = x.indexOf("@");
  var dotpos = x.lastIndexOf(".");
  if (atpos < 1 || dotpos < atpos + 2 || dotpos + 2 >= x.length) {
    return false;
  }
  return true;
}

if (name == '') {
  $('.name').fadeOut(200).show();
}
else if (email == '' || !isValidEmail()) {
  $('.email').fadeOut(200).show();
}
else if (subject == '') {
  $('.subject').fadeOut(200).show();
}
else if (message == '') {
  $('.message').fadeOut(200).show();
}
else {
  // submit
}
Member Avatar for vizz

thanks

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.