form button fun 1

RedRobotHero · Nov 23, 2003

I have a form with two buttons. One is a submit button, and the other runs a function to calculate the total price of what was entered in the form.

I want to run the calculate function when I press enter. Right now, it submits the form. How do I change the actions performed when I hit enter?

LakshmiKiran · Nov 24, 2003

Hi,
Give the javascript function you wish to call in the form action and ur problem is solved. Like this..

<form name="test1" method="POST" action="javascript:FocusMe()" >

RedRobotHero · Nov 24, 2003

Hmm. That completely disables the submit button and the enter key, but does not make it calculate.

Here's the page stripped down to the heart of the matter:

http://www.horriblepain.com/buy/formtrouble.html

And here's me trying to do what you suggested:

http://www.horriblepain.com/buy/formtrouble2.html

Lrnmore · Nov 24, 2003

RedRobotHero,

I think this is working like you want with the enter doing
the calc and the image doing the submit, give it a try.

I took out the action for testing but you can repair that.

Code:

<HTML><HEAD><TITLE>Shopping Cart</TITLE>
<META http-equiv=Content-Type content=&quot;text/html; charset=windows-1252&quot;>
<SCRIPT language=JavaScript>
function calculate(form) {
form.pricehill.value = eval(form.numhill.value)*3.50
form.pricetract.value = eval(form.numtract.value)*0.50
}
function chkey(){
if(event.keyCode == 13){
  calculate(document.forms[0]);}
}
-->
</SCRIPT>
<STYLE type=text/css>.req {
	BACKGROUND-COLOR: #ffffff
}
.nreq {
	BACKGROUND-COLOR: #dddde9
}
</STYLE>
<META content=&quot;MSHTML 6.00.2800.1106&quot; name=GENERATOR></HEAD>
<BODY onkeypress=&quot;chkey();&quot;>
<FORM class=blue id=purchase method=get><INPUT 
class=req maxLength=5 value=0 name=numhill> $<INPUT class=nreq readOnly 
maxLength=5 value=0 name=pricehill> <INPUT class=req maxLength=5 value=0 
name=numtract> $<INPUT class=nreq readOnly maxLength=5 value=0 name=pricetract> 
<a href=&quot;#&quot; onclick=&quot;document.forms[0].submit();&quot;>
<img src=&quot;butncalc_files/x-click-but23.gif&quot; border=&quot;0&quot;></a>
<INPUT class=nreq onclick=calculate(this.form) type=button value=&quot;re-calculate price&quot;> 
</FORM></BODY></HTML>[\code]

2b||!2b

RedRobotHero · Nov 24, 2003

That gets me most of the way. It still submits when I press enter, but it does the calculation first, which is an improvement.

Is there any way for me to make it only submit when the user clicks the "submit" button? (which is now a link, rather than a true button)

vbkris · Nov 25, 2003

Lrnmore · Nov 25, 2003

Hello, in my testing of the above page that wasn't a problem
with IE6.0.

Maybe you could upload what you wound up with at one of your
test sites.

Did you remove the "type=image"?

2b||!2b

RedRobotHero · Nov 25, 2003

It's right here:

http://www.horriblepain.com/buy/cart.html

And, I guess I was only having that problem in Opera. I just tested it in IE and it works fine. In Netscape, it has the opposite problem, that hitting enter does nothing.

Maybe I'll live with that as is, but if anyone knows a way to fix the browser inconsistancies...

Lrnmore · Nov 25, 2003

Here's some changes you can try, please let me know if this
works in the other browsers...

Code:

function chkey(evt){
  if(evt.keyCode) {
  kcode = evt.keyCode;}
  else { if(evt.which) {
  kcode = evt.which; } }
    if(kcode == 13){
  calculate(document.forms[0]);}
}

and

<BODY onkeypress=&quot;chkey(event);&quot;>

2b||!2b

RedRobotHero · Nov 25, 2003

That fixed Netscape up good, but not Opera.

Luckily, I found an example online:

http://members.blue.net.au/felgall/jstip43.htm

And I incorporated some of that solution in with yours. Now it works in all three. Thanks!

Lrnmore · Nov 25, 2003

Your welcome and thanks for the tip.

2b||!2b

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

form button fun 1

RedRobotHero

Technical User

LakshmiKiran

Programmer

RedRobotHero

Technical User

Lrnmore

Technical User

RedRobotHero

Technical User

vbkris

Programmer

Lrnmore

Technical User

RedRobotHero

Technical User

Lrnmore

Technical User

RedRobotHero

Technical User

Lrnmore

Technical User

Similar threads

Part and Inventory Search

Sponsor