Return false in different position

This does not prevent postback-->
<html>
<head>
<script language="javascript">
var otxt;
function init(){
otxt=frm.txt;
}
function call(){
otxt.value="hello";
return false;
}
</script>
</head>
<body onload="init()">
<form id="frm">
<input type="text" id="txt"/>
<input type="submit" id="btn" onclick="call()"/>
</form>
</body>
</html>

but this does(which is the outcome I want)-->
<html>
<head>
<script language="javascript">
var otxt;
function init(){
otxt=frm.txt;
}
function call(){
otxt.value="hello";
}
</script>
</head>
<body onload="init()">
<form id="frm">
<input type="text" id="txt"/>
<input type="submit" id="btn" onclick="call();return false;"/>
</form>
</body>
</html>

Why this happens as I just put the "return false" at different place?
LVL 9
william007Asked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

iamanindianCommented:
If you are using:
<input type="submit"

This object will submit the form it sits in. So, you need to do something to make the event return false (instead of true) to stop the form from getting submitted. You did that in the 2nd example.

Things could well have been simplified...if in the first place, instead of using a "submit" you had used "button" as input type e.g.

<input name="Button" type="button" id="btn" onclick="call()" value="Button"/>

Does this clarify enough?
Regards
WC
william007Author Commented:
Actually I intentionally used the submit type..
What I want to know is...first example I put the return=false inside the function, second example I directly put in the onclick value... the return false will be called in both cases, but why first example does not work?
RoonaanCommented:
In the first example you would have to use:

onclick="return call();".

Because you have:
onclick="call();" and call returns false, it is interpreted als onclick="false;", which is a javascript statement, but not a statement stopping the submit.

Whereas onclick="return call();" result into onclick="return false;" and onclick="call();return false" results in "false;return false;". These both cancel the submit.

-r-

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Your Guide to Achieving IT Business Success

The IT Service Excellence Tool Kit has best practices to keep your clients happy and business booming. Inside, you’ll find everything you need to increase client satisfaction and retention, become more competitive, and increase your overall success.

GwynforWebCommented:
returning false cancels ant eventfrom then on, ie stops it dead in its tracks, the statements 'false;' or 'true;' are valid but  do nothing.  So

<input type="submit" id="btn" onclick="return call();"/>

will also stop post back.

This further illustrates the effect (take out the return and call2() is called)

<script language="javascript">
true;
var otxt;
function init(){
otxt=frm.txt;
}
function call(){
otxt.value="hello";
return false;
}
function call2(){
function call(){
otxt.value="hello again";
}

}
</script>

<body onload="init()">
<form id="frm" action="http://google.com">
  <p><input type="text" id="txt" /> <input type="submit" id="btn" onclick="return call();call2()" />
  </p>
</form>
</body>

GwynforWebCommented:
shld read "returning false cancels an event from then on,.."

GwynforWebCommented:
I am sorry for spamming the thread but my code is all messed up and shld be

<script language="javascript">
var otxt;
true
function init(){
otxt=frm.txt;
}
function call(){
otxt.value="hello";
return false;
}
function call2(){
alert("hello again");
}
</script>

<body onload="init()">
<form id="frm" action="http://google.com">
  <p><input type="text" id="txt" /> <input type="submit" id="btn" onclick="return call();call2()" /> </p>
</form>
</body>
william007Author Commented:
Thanks:)
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
JavaScript

From novice to tech pro — start learning today.