vinpkl Posted October 2, 2012 Share Posted October 2, 2012 hi all why does my validation error messages blink of click they dont stay static. whats the solution <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title></title> </head> <script type="text/javascript"> function doValidate() { if(document.registerform.textbox1.value= " ") { document.getElementById("hiddenDiv").innerHTML = "enter your email id its required"; } if(document.registerform.textbox2.value= " ") { document.getElementById("hiddenDiv2").innerHTML = "enter your password id its required"; } } </script> <body> <form onsubmit="return doValidate();" method="post" name="registerform"> <input name="textbox1" id="textbox1" /><div id="hiddenDiv"></div> <input name="textbox1" id="textbox2" /><div id="hiddenDiv2"></div> <input type="submit" name="" value="Submit"/> </form> </body> </html> vineet Quote Link to comment Share on other sites More sharing options...
kicken Posted October 2, 2012 Share Posted October 2, 2012 The problem is you're not cancelling the form submission so the page reloads. What happens is your JS function runs and populates the error div's with the messages. A split second later the form submits and the browser starts reloading the page. When the page reloads everything is reset so the messages disappear. You need to return false in the onsubmit handler to cancel the form submit. You already added the 'return ' key word there so it will return whatever value your doValidate function returns. You never setup a return value for that function though. You need to use a variable to track if there are errors and return true or false depending on that. function doValidate() { var hasErrors=false; if(document.registerform.textbox1.value= " ") { document.getElementById("hiddenDiv").innerHTML = "enter your email id its required"; hasErrors=true; } if(document.registerform.textbox2.value= " ") { document.getElementById("hiddenDiv2").innerHTML = "enter your password id its required"; hasErrors=true; } return !hasErrors; } Quote Link to comment Share on other sites More sharing options...
vinpkl Posted October 2, 2012 Author Share Posted October 2, 2012 thanks kicken now they dont blink. But they should disappear when second time user enters correct data and click submit button. can you help me with that ? vineet Quote Link to comment Share on other sites More sharing options...
jazzman1 Posted October 2, 2012 Share Posted October 2, 2012 Have you ever checked this value ? You will see the real value - is undefind <script type="text/javascript"> function doValidate() { console.log(document.registerform.textbox1.value); } </script> Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.