Jump to content

stop submiting a form


es131245
 Share

Recommended Posts

<html><head><script type="text/javascript" src="functions.js" /></script><!--  CONTENT OF THE "FUNCTION.JS FILEfunction login(){if(document.getElementById('login').value=='login'||document.getElementById('password').value=='password') {document.getElementById('login').style.color='red';  document.getElementById('login').style.textDecoration='blink';  setTimeout(function()   {document.getElementById('login').style.color='black';    document.getElementById('login').style.textDecoration='none';   },3000);  return false; }}--></head><body><form id="LoginForm" name="LoginForm" action="" method="post" onsubmit="window.login()"><img src="/source/add.png" onclick="window.location.href=window.location.pathname+'?act=login';" /><input type="text" id="login" name="login" value="login" onmouseover="if(this.value=='login'){this.value='';}this.focus();" onmouseout="if(this.value==''){this.value='login';}" /><br /><img src="/source/accept.png" onclick="document.LoginForm.elements[2].click();" /><input type="password" id="password" name="password" value="password" onmouseover="if(this.value=='password'){this.value='';}this.focus();" onmouseout="if(this.value==''){this.value='password';}" /><br /><input type="submit" id="submit" style="display:none;" /></form></body></html>

QUESTION:<img onclick="document.LoginForm.submit();return false;" /> is a bad idea because it prevents form onsubmit codeso ive used <img onclick="document.LoginForm.elements[2].click();" /><input type="submit" value="submit" style="display:none;" />BUT now onsubmit cant use "login()"!!!!!so ive found that it works with "window.login()"BUT now i cant stop submitting form by "return false;"AND "window.stop();" abort() exit() doent help too!!!ANY suggestions????

Link to comment
Share on other sites

Hi!Try This Method:I Just Add 2 Lines...1: <input type="image" src="images/submit.gif" height="30" width="200" border="0" alt="Submit Form">Use Image As Submit Button.2: <form id="LoginForm" name="LoginForm" action="login.php" method="post" onsubmit="return login();">Use login.php in form action.If You Want Any Other Function To Any Image Or Button ClickJust Use This Command onclick="function2();" or onmouseover="function3();" etc etc etc...Hope U Understand.

<html><head><script type="text/javascript" src="functions.js" /></script><script type="text/javascript" />function login(){	if(document.getElementById('login').value=='login' || document.getElementById('password').value=='password')    {    	document.getElementById('login').style.color='red';		document.getElementById('login').style.textDecoration='blink';		setTimeout(function(){document.getElementById('login').style.color='black';document.getElementById('login').style.textDecoration='none';},3000);		return false;	}}</script></head><body><form id="LoginForm" name="LoginForm" action="login.php" method="post" onsubmit="return login();">    <img src="/source/add.png" onclick="window.location.href=window.location.pathname+'?act=login';" />    <input type="text" id="login" name="login" value="login" onmouseover="if(this.value=='login'){this.value='';}this.focus();" onmouseout="if(this.value==''){this.value='login';}" /><br />    <img src="/source/accept.png" onclick="document.LoginForm.elements[2].click();" />    <input type="password" id="password" name="password" value="password" onmouseover="if(this.value=='password'){this.value='';}this.focus();" onmouseout="if(this.value==''){this.value='password';}" /><br />    <input type="image" src="images/submit.gif" height="30" width="200" border="0" alt="Submit Form">    <input type="submit" id="submit" style="display:none;" /></form></body></html>

Link to comment
Share on other sites

Done it background-color:transparent; make it same a pic but function still doent stop submiting !return false; doent stops firefox from submiting a form

Edited by es131245
Link to comment
Share on other sites

only way that works isfunction login(){if(....) //login is bad || passowrd is bad{ document.getElementById('login').style.color='red';' document.getElementById('login').value='login' ;}<form ...... onsubmit="if(document.getElementById('login').value=='login'){return false;} "><input type="image" src="...." onclick="login()" />ORWORK with YOUR CODE BUTform onsubmit="return window.login();">

Edited by es131245
Link to comment
Share on other sites

Not exactly sure what you are trying to achieve, might have it totally wrong, but it it similar to this

<script type="text/javascript">/*<![CDATA[*//*---->*/function login(){login_input = document.getElementById('login');pass_input = document.getElementById('password');if(login_input.value=='login' || pass_input.value=='password'){//alert("boomshaka")login_input.style.color='red';login_input.style.textDecoration='blink';setTimeout(function(){login_input.style.color='black';login_input.style.textDecoration='none';},3000);return false;}else{document.getElementById('LoginForm').submit();}}window.onload=function(){login_input = document.getElementById('login');pass_input = document.getElementById('password');login_input.onmouseover = function()	{	if(this.value=='login')		{		this.value='';		}	this.focus();	}login_input.onmouseout = function()	{	if(this.value=='')		{		this.value='login';		}	}pass_input.onmouseover= function()	{	if(this.value=='password')		{		this.value='';		}	this.focus();	}	pass_input.onmouseout= function()	{	if(this.value=='')		{		this.value='password';		}	}	document.getElementById('add').onclick=function(){window.location.href=window.location.pathname+'?act=login';}document.getElementById('accept').onclick=function(){login();}}/*--*//*]]>*/</script><style type="text/css">/*img {width:200px; height:25px; background-color:#00CCFF; display:block;}*/</style></head><body><form id="LoginForm" name="LoginForm" action="" method="post" onsubmit="login()"><img id="add" src="/source/add.png" /><input type="text" id="login" name="login" value="login" /><br /><img id="accept" src="/source/accept.png" /><input type="password" id="password" name="password" value="password" /><br /><input type="submit" id="submit" style="visibility:hidden;" /></form></body></html>

Edited by dsonesuk
Link to comment
Share on other sites

ive got a question about seperating js and html<script type="text/javascript" src="script.js" /></script>

window.onload=function(){ var stamp=new Date(document.getElementById('date').innerHTML); function clock() {stamp.setSeconds(stamp.getSeconds()+1);  document.getElementById('date').innerHTML=stamp.getDate()+'/'+stamp.getMonth()+'/'+stamp.getFullYear();  document.getElementById('time').innerHTML=stamp.getHours()+':'+stamp.getMinutes()+':'+stamp.getSeconds();  setTimeout('clock();',1000); } clock(); document.getElementById('login').onmouseover=function(){if(this.value=='login'){this.value='';}this.focus();} document.getElementById('login').onmouseout=function(){if(this.value==''){this.value='login';}this.blur();} document.getElementById('password').onmouseover=function(){if(this.value=='password'){this.value='';}this.focus();} document.getElementById('password').onmouseout=function(){if(this.value==''){this.value='password';}this.blur();} document.getElementById('registrate').onclick=function(){window.location.href=window.location.pathname+'?act=login';} document.LoginForm.onsubmit=function(){if(document.getElementById('login').value==''||document.getElementById('login').value=='login'||document.getElementById('password').value=='')  {document.getElementById('login').style.color='red';   document.getElementById('login').style.textDecoration='blink';   document.getElementById('password').style.color='red';   document.getElementById('password').style.textDecoration='blink';   setTimeout(function()   {document.getElementById('login').style.color='black';	 document.getElementById('login').style.textDecoration='none';	 document.getElementById('password').style.color='black';	 document.getElementById('password').style.textDecoration='none';   },3000);   return false;  } }}

but function in a function doent work...ff says>>>> clock();clock is not definedbut in html it worked well

Link to comment
Share on other sites

that's because the functions are only run once within the onload function, and are not global and therefore cannot be accessed from outside the onload function.clock(); can be placed inside onload, as you need these elements with id date, time to be rendered before running this function.var stamp=new Date(document.getElementById('date').innerHTML); needs to only run when called through function. <script type="text/javascript">/*<![CDATA[*//*---->*/function clock(){var stamp=new Date(document.getElementById('date').innerHTML);stamp.setSeconds(stamp.getSeconds()+1); document.getElementById('date').innerHTML=stamp.getDate()+'/'+stamp.getMonth()+'/'+stamp.getFullYear(); document.getElementById('time').innerHTML=stamp.getHours()+':'+stamp.getMinutes()+':'+stamp.getSeconds(); setTimeout('clock();',1000);}window.onload=function(){clock();...rest of code}/*--*//*]]>*/</script>

Link to comment
Share on other sites

You can also explicitly define it in the window scope, and then it will be available for setTimeout to use:

window.clock = function(){  stamp.setSeconds(stamp.getSeconds()+1);  document.getElementById('date').innerHTML=stamp.getDate()+'/'+stamp.getMonth()+'/'+stamp.getFullYear();  document.getElementById('time').innerHTML=stamp.getHours()+':'+stamp.getMinutes()+':'+stamp.getSeconds();  setTimeout('clock();',1000);}clock();

You can also pass setTimeout a reference to the function instead of the name in quotes:

function clock(){stamp.setSeconds(stamp.getSeconds()+1);  document.getElementById('date').innerHTML=stamp.getDate()+'/'+stamp.getMonth()+'/'+stamp.getFullYear();  document.getElementById('time').innerHTML=stamp.getHours()+':'+stamp.getMinutes()+':'+stamp.getSeconds();  setTimeout(clock, 1000);}clock();

Link to comment
Share on other sites

its a bit different here...because I'm using server time on my page so its like....

<sub id="date"><?php print(date('F j,Y H:i:s'));?></sub><sub id="time"></sub>

function clock(){stamp.setSeconds(stamp.getSeconds()+1); document.getElementById('date').innerHTML=stamp.getDate()+'/'+stamp.getMonth()+'/'+stamp.getFullYear(); document.getElementById('time').innerHTML=stamp.getHours()+':'+stamp.getMinutes()+':'+stamp.getSeconds(); setTimeout('clock(stamp);',1000);}window.onload=function(){clock(stamp=new Date(document.getElementById('date').innerHTML));}

Edited by es131245
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...