Jump to content

Recommended Posts

I've been trying to do a simple animation to simulate (only simulate, it doesn't check anything at all) a loading bar after the form is submited.Here's the code:

<form action="myform.php" method="POST" name="form" id="form" onsubmit="return formcheck(this)">Name: <input type="text" style="width:200px;" name="name" id="name" /></form>

And the script:

function formcheck(form){	if(form.name.value == "")	{		alert("Please type your name");		form.name.focus();		return false;	}	else	{		var perc = 0;		var inter;		document.getElementById("body").innerHTML += "<div id=\"message\" class=\"texto\"><p>Please wait while your request is sent... <span id=\"num\">0%</span><br /><div id=\"loader\" style=\"position:relative; width:0%; background-color:teal;\"></div></p></div>";		inter = setInterval(function(){			if(perc < 100)			{				perc++;				document.getElementById("loader").style.width = perc + "%";				document.getElementById("num").innerHTML = perc + "%";			}			else			{				return true;			}		}, 50);	}}

But this doesn't work =(After the animation's complete it just halts (the form action isn't called). Any way so I can get around this?

Edited by Shakazahn
Link to post
Share on other sites

Your formcheck function is not returning true, that's why the form is not submitting. If you want to submit the form after the animation ends, get the form object and call its submit method explicitly.

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...