onsubmit passes even when js function returns false

Question

I've read many posts considering this problem and for some reason none of the solutions work for me. I have several js functions for validation that are called in the main one that is appointed to the onSubmit tag in the form. Here is the js code:

<script type="text/javascript">
function validacijaForme() {

var username = document.getElementById('usname');
var email = document.getElementById('email');
var pass1 = document.getElementById('pass1');
var pass2 = document.getElementById('pass2');


 if(validacijaUsername(username) && validacijaEmail(email) && validacijaSifri(pass1,pass2))
{
  alert('success');
  return true;
}

return false;
}

</script>

<script type="text/javascript">
function validacijaSifri(fieldId1, fieldId2)
{
var two = document.getElementById(fieldId1).value;
var three = document.getElementById(fieldId2).value;
if(two == three) { return true; }
alert("Warning!! passcodes must match!!!");
return false;
}
</script>

<script type="text/javascript">
function validacijaUsername(usname)
{
var letters = /^[A-Za-z]+$/;  
if(letters.test(usname.value))  
{  
  return true;  
}  
else  
{  
  alert('Username must have alphabet characters only');  
  document.getElementById('usrname').focus();  
  return false;  
} 
}
</script>  

<script type="text/javascript">
function validacijaEmail(email)
{
var mailformat = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;  
if(mailformat.test(email))  
{  
  return true;  
}  
else  
{  
  alert("You have entered an invalid email address!");  
  document.getElementById(email).focus(); 
  return false;  
 }  

} 

and here is the html form code

<form class="form-signin" onSubmit="return validacijaForme();" name="registerForm" method = "POST" action="test.php" enctype="multipart/form-data">
<h2 class="form-signin-heading">Registracija</h2>
<input type="text" class="form-control" placeholder="Username" name="usrname" id="usname" autofocus>
<input type="text" class="form-control" placeholder="E-mail" name="email" id="email">
<input  type="password" class="form-control" placeholder="Password" name="pass" id="pass1">
<input  type="password" class="form-control" placeholder="Confirm password" id="pass2">
<button class="btn btn-lg btn-primary btn-block" name="dugme" type="submit">Register</button>

The problem is that all the alerts are working, meaning that those functions do validate the fields, and should return false, but the onSubmit tag doesn't seem to accept that value from the function. The form doesn't submit and doesn't pass to test.php only if I type this:

 <form class="form-signin" onSubmit="return false" name="registerForm"  method = "POST" action="test.php" enctype="multipart/form-data">

Answer 1

submit the form with javascript submit()

<form id="myform" class="form-signin" onSubmit="validacijaForme();" name="registerForm" 
method = "POST" action="test.php" enctype="multipart/form-data">

And in your function:

function validacijaForme() {
var username = document.getElementById('usname');
var email = document.getElementById('email');
var pass1 = document.getElementById('pass1');
var pass2 = document.getElementById('pass2');

if(validacijaUsername(username) && validacijaEmail(email) && validacijaSifri(pass1,pass2))
{
alert('success');
document.getElementById("myform").submit();
return false;
}
return false;
}

Answer 2

Your problem is related to your username id/name consistency. Use the console (F12) to debug this kind of thing.

<input type="text" class="form-control" placeholder="Username" name="usRname" id="usname" autofocus>

Change:

    document.getElementById('usrname').focus();

To:

    document.getElementById('usname').focus();

Answer 3

There are lots of errors in your code buddy | WORKING DEMO

function validacijaForme() {

var username = document.getElementById('usname');
var email = document.getElementById('email');
var pass1 = document.getElementById('pass1');
var pass2 = document.getElementById('pass2');


 if(validacijaUsername(username) && validacijaEmail(email) && validacijaSifri(pass1,pass2))
{
  alert('success');
  return true;
}

return false;
}

function validacijaSifri(fieldId1, fieldId2)
{
var two = fieldId1.value;
var three = fieldId2.value;
if(two == three) { return true; }
alert("Warning!! passcodes must match!!!");
return false;
}

function validacijaUsername(usname)
{
    var letters = /^[A-Za-z]+$/;  

    if(letters.test(usname.value))  
    {  
      return true;  
    }  
    else  
    {  
      alert('Username must have alphabet characters only');  
      document.getElementById('usname').focus();  
      return false;  
    } 
}

function validacijaEmail(email)
{
var mailformat = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;  
if(mailformat.test(email.value))  
{  
  return true;  
}  
else  
{  
  alert("You have entered an invalid email address!");  
  document.getElementById('email').focus(); 
  return false;  
 }  

}