more than 1 form with onsubmit using different function

Question

I have 2 forms, one for email and one for phonenumber, I created 2 functions inside a to Validate the email and PhoneNumber, but when I submit its just uses the Function associated to the First Form.

I can actually swap between First and Second form and always will only run the one what comes first in the code, but the other will never run.

<script type="text/javascript">

function validatePhone()
{
var y=document.forms["MyPhone"]["PhoneN"].value;
var Pholen=y.length
if (Pholen < 10)
  {
  alert("Number must be at last 10 Chars");
  return false;
  }
}

function validateForm()
{
var x=document.forms["MyMail"]["mailN"].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;
  }
}
</script>

<form name='MyPhone' onsubmit="return validatePhone()" method="post">Phone*: <input type="number" maxlength="10" name='PhoneN' onkeyup="this.value = this.value.replace(/[^0-9]/, '')"  size="16">

<form name='MyMail' onsubmit="return validateForm()" method="post">Your Email*: <input type="character" name='mailN' size="16">

Answer 1

Maybe you could try something like this

<form name='MyForm' onsubmit="validatePhone();validateForm();" method="post">
  <label for="PhoneN">Phone*:</label>
  <input type="number" maxlength="10" name='PhoneN' onkeyup="this.value = this.value.replace(/[^0-9]/, '')" size="16">
  <label for="mailN">Your Email*:</label>
  <input type="text" name='mailN' size="16">
  <button name="submit" type="submit">Submit</button>
</form>