简体   繁体   中英

Javascript validation for multiple functions?

i have a javascipt function for a form. The code is :

<script type="text/javascript">
function verify() {
    if (isNaN(document.form1.exp_amount.value) == true) {
        alert("Invalid Block Amount");
        return false;
    } else if ((document.form1.exp_name.value).length == 0) {
        alert("Block Exp is left Blank!");
        return false;
    } else if ((document.form1.exp_amount.value).length == 0) {
        alert("Block Amount is left Blank!");
        return false;
    } else {
        document.form1.submit();
        return true;
    }
}
</script>

and now i have to provide Alphabet Validation for it, which i have it in seperate JS function:

<script language="javascript" >
function checkName() {
    re = /^[A-Za-z]+$/;
    if (re.test(document.exp_name.form1.value)) {
        alert('Valid Name.');
    } else {
        alert('Invalid Name.');
    }
}
</script>

If i want to have Alphabet validation inside function verify().. How could i do it? or is there any other ways?

Please change your validation and form to this which will allow submission of the form if valid and not if errors. The following code is in my opinion canonical and will work on all browsers that support regular expressions (which was introduced in JS1.1 in 1996 with NS3.0) - please note that javascript does not support dashes in names unless you quote the field name in the script. The code does not need the form to be named since it passes the form object in the call (this) and uses the object in the function as theForm

<html>
<head>
<title>Canonical forms validation without jQuery</title>
<script type="text/javascript">
var validName = /^[A-Za-z]+$/;
function checkName(str) {
  return validName.test(str);
}

function verify(theForm) {
  // note: theForm["..."] is short for theForm.elements["..."];
  var amount = theForm["exp_amount"].value; 
  if(amount ==""){
    alert("Block Amount is left blank");
    theForm["exp_amount"].focus();
    return false;
  }
  if (isNaN(amount)) {
    alert("Invalid Block Amount");
    theForm["exp_amount"].focus();
    return false;
  }

  var name = theForm["exp_name"].value; 
  if(name.length==0) {
    alert("Block Exp is left Blank!");
    theForm["exp_name"].focus();
    return false;
  }
  if(!checkName(name)) {
    alert("Block Exp is invalid!");
    theForm["exp_name"].focus();
    return false;
  }
  return true;
}
</script>
</head>
<body>
<form onsubmit="return verify(this)">
Amount: <input type="text" name="exp_amount" value="" /><br />
Name: <input type="text" name="exp_name" value="" /><br />
<input type="submit" />
</form>
</body>
</html>
<script type="text/javascript">
function verify()
{
    if(isNaN(document.form1.exp_amount.value)==true)
    {
         alert("Invalid Block Amount");
         return false;
    }
    else if((document.form1.exp_name.value).length==0)
    {
         alert("Block Exp is left Blank!");
         return false;
    }
    else if((document.form1.exp_amount.value).length==0)
    {
         alert("Block Amount is left Blank!");
         return false;
    }
    else if(!(/^[A-Za-z]+$/.test(document.form1.exp_amount.value))) //ADD THIS
    {
        alert('Invalid Name');
        return false;
    }

     document.form1.submit();
     return true;
}
</script>

Simply return false or true inside your checkName function:

function checkName()
{
    re = /^[A-Za-z]+$/;
    if(re.test(document.exp_name.form1.value))
    {
        alert('Valid Name.');
        return true;
    }
    else
    {
        alert('Invalid Name.');
        false;
    }
}

Then call it and check the result.

    ...

    else if((document.form1.exp_amount.value).length==0)
    {
        alert("Block Amount is left Blank!");
        return false;
    }

    else if (!checkName()) {
        return false;
    }

    else
    {
        document.form1.submit();
        return true;
    }

As an aside, there are many ways your code can be cleaned up and improved. I don't want to get into them now, but if you'd like to discuss it, just leave a comment.

Edit your checkName() function to

function checkName()
{
re = /^[A-Za-z]+$/;
if(re.test(document.exp_name.form1.value))
{
     alert('Valid Name.');
     return true;
}
else
{
    alert('Invalid Name.');
    return false;

}

}

And add

else if(!checkName()){ return false;}

to your validation code just before the form submit

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM