Javascript onsubmit() function not doing anything

Question

I have a problem with Javascript functions. My function won't work, I called it in a form with the onsubmit() call but nothing happens.

$(document).ready(function(){
	window.provera = function(){
		nizError = new Array();

		var ime = $("#imeReg").val();
 		var reIme = /^[A-Z][a-z]{2,9}$/;

 		var prezime = $("#prezimeReg").val();
 		var rePrezime = /^[A-Z][a-z]{2,14}(\s[A-Z][a-z]{2,14})*$/;

 		var username = $("#usernameReg").val();
 		var reUsername = /^([A-Za-z]+[0-9]|[0-9]+[A-Za-z])[A-Za-z0-9]*$/;

 		var email = $("#emailReg").val();
		var reEmail =/^[\w]+[\.\_\w]*\@[\w]+([\.][\w]+)+$/;

 		var password = $("#passwordReg").val();
 		var rePassword = /^[\S]{5,50}$/;

		if(!reIme.test(ime)){
			nizError.push('Pogresno ste uneli ime');
		}else if(ime = ""){
			nizError.push('Ime je obavezno da se unese');
		}

		if(!rePrezime.test(prezime)){
			nizError.push('Pogresno ste uneli prezime');
		}else if(prezime = ""){
			nizError.push('Prezime je obavezno da se unese');
		}

		if(!reUsername.test(username)){
			nizError.push('Pogresno ste uneli username');
		}else if(username = ""){
			nizError.push('Username je obavezno da se unese');
		}

		if(!reEmail.test(email)){
			nizError.push('email');
		}else if(email = ""){
			nizError.push('Email je obavezno da se unese');
		}

		if(!rePassword.test(password)){
			nizError.push('password');
		}else if(password = ""){
			nizError.push('Password je obavezno da se unese');
		}

		var ispis = "";

		if(nizError.length > 0){
			for(var i = 0; i < nizError.length; i++){
				ispis+= "<p>"+ nizError[i] +"</p>";
			}
			$("#result").html(ispis);
			return false;
		}
		return true;
	}
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table class="tableLogin">
			<form action="#" method="post" onsubmit="provera()">
				<tr>
					<td>
						<label>Ime</label>
					</td>
					<td>
						<input type="text" id="imeReg" name="imeReg" class="typeText"/>
					</td>
				</tr>
				<tr>
					<td>
						<label>Prezime</label>
					</td>
					<td>
						<input type="text" id="prezimeReg" name="prezimeReg" class="typeText"/>
					</td>
				</tr>
				<tr>
					<td>
						<label>Username</label>
					</td>
					<td>
						<input type="text" id="usernameReg" name="usernameReg" class="typeText"/>
					</td>
				</tr>
				<tr>
					<td>
						<label>E-mail</label>
					</td>
					<td>
						<input type="text" id="emailReg" name="emailReg" class="typeText"/>
					</td>
				</tr>
				<tr>
					<td>
						<label>Password</label>
					</td>
					<td>
						<input type="password" id="passwordReg" name="passwordReg" class="typeText"/>
					</td>
				</tr>
				<tr>
					<td colspan="2">
						<input type="submit" value="Registruj se" id="btnSubReg" name="btnSubReg" class="buttonSub"/>
					</td>
				</tr>
			</form>
		</table>

When I leave # on action attribute nothing happens, but when I try to put some page like admin.php it goes to that page and again I can't validate my form.

I'm working on a website for my studies and I need to validate a form on the client side so if everything is okay it goes on to ther server side where I can again validate it with php and send to the database.

Add your page.php link for your action attribute. When your event handler (provera) for onsubmit is invoked, call event.preventDefault if the client-side validation fails. preventDefault will prevent the submit/page navigation from occurring. — Jack
– Jack, Commented Mar 21, 2019 at 2:06
[email protected] is a valid email address but this form prevents that from being used. — tadman
– tadman, Commented Mar 21, 2019 at 2:19
Try linking in with $('form').submit(function() { ... }) and include your function there to be sure it runs on submit. This is a more concise way of linking it in than this method of shoving it into window first. It's probable you're using the function before its defined with your approach. — tadman
– tadman, Commented Mar 21, 2019 at 2:21
It's also conventional to just say nizError = [ ] instead of the explicit and much more verbose new Array(). — tadman
– tadman, Commented Mar 21, 2019 at 2:27

Ilijanovic · Accepted Answer · 2019-03-21 02:10:10Z

1

Instead of this:

   <input type="submit" value="Registruj se" 
     id="btnSubReg" name="btnSubReg" 
     class="buttonSub"/>

Use this:

    <input type="button" value="Registruj se" 
   id="btnSubReg" onclick="provera()" name="btnSubReg" 
    class="buttonSub"/>

And in your javascript add at the end if everything is valid this:

  document.getElementById("myForm").submit();

And add in "action" your php file path.

answered Mar 21, 2019 at 2:10

Ilijanovic

15k4 gold badges29 silver badges63 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Dusan Stankovic Over a year ago

I done everything as you said and again nothing. It should show me text error from nizGreske because I leave everything in form empty, but nothing happens

tadman Over a year ago

This code is using jQuery so $('#myform').submit() should suffice.

Ilijanovic Over a year ago

You should give your form an id for example id="register"

Ali Haider Warraich · Accepted Answer · 2019-03-21 02:17:14Z

0

You are not calling the OnSubmit() function <td colspan="2"> <input type="submit" value="Registruj se" id="btnSubReg" name="btnSubReg" class="buttonSub" onsubmit="return upload(this)"/> </td>

answered Mar 21, 2019 at 2:17

Ali Haider Warraich

414 bronze badges

Collectives™ on Stack Overflow

Javascript onsubmit() function not doing anything

2 Answers 2

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related