Solved

Multiple <input type="image"> form submission

Posted on 2001-09-04
5
242 Views
Last Modified: 2006-11-17
OVERVIEW OF PROBLEM
--------------------

A form handler is not working when a user submits a form using the Enter key, instead of clicking on a button in the form.

It works when the form has more than one textbox.  If the form has one or zero textboxes, it doesn't work.

Link to page that demonstrates the problem:  
http://www.danallen.com/TempDemo/FormSubmission1FieldsDemo.asp



BACKGROUND
-----------

Everything works fine when a user clicks on one of the buttons in the form.  The buttons are coded as

<form>
<input type="image" src="xxx.jpg" name="buttonName1">
<input type="image" src="xxy.jpg" name="buttonName2">
</form>

Each button as a different name.  Here is a link to a page that shows this:
http://www.danallen.com/TempDemo/FormSubmission2FieldsDemo.asp


The form handler figures out which button was clicked button by looking for a non-empty value in
request.form("buttonName.x").  (The .x refers to an x-coordinate value that gets put into the form collection for the image that was clicked...personally, I think this is a lame way to do things, but whatever....).  To view ASP source code:
http://www.danallen.com/TempDemo/SourceCode2Fields.htm


If a user hits the ENTER key, instead of selecting a button, the first button in the form gets a non-empty value posted to its x-coordinate in the form collection.

For some (dumb) reason, this doesn't work when there are less than 2 textboxes in the form.  In the case where there are one or zero textboxes in the form, nothing gets posted to the x-coordinate of the first button.  Maybe there is a good reason for this, but it seems like a bug in HTML to me.  But such is life.  Here is a link to a demo of this scenario:
http://www.danallen.com/TempDemo/FormSubmission1FieldsDemo.asp



This "feature" causes a problem for our form handler.  Specifically, our form handler interpets the case where no buttons where selected as something you don't want to know about, but I cannot change (another programmer set this up, and he is the CEO's brother in law).

SSSSSSooooooooo..............

What should I do about this?  I need a way to tell the form handler that to use the first button on the form if the user hits the ENTER key.

I realize this is a nebulous question....I'll award points to all contributors as fairly as I can.  Humor awarded as liberally as technical contributions.



0
Comment
Question by:Danimal
  • 3
  • 2
5 Comments
 
LVL 2

Accepted Solution

by:
MCM earned 40 total points
ID: 6454697
try something like this:

<input
     type="TEXTBOX"
     name="WHATEVER"
     onKeyPress="{return (((document.all) : window.event.keyCode ? evt.which )!==13)}"
     >

it's not a bug, the submit-on-enter with one box is behaviour by design and a pain in the tuchus. this snippet is supposed to cancel the keypress event when the value fot he key pressed is "13", which as you might have guessed is the value that corresponds to the enter key.

0
 
LVL 1

Author Comment

by:Danimal
ID: 6454725
MCM, thanks for responding.

maybe you and I have different definitions of "bug".  To me, it doesn't matter whether it is behavior by design or not.  If the behavior is dysfunctional, there is some sort of bug going on.  Pain in the tuches counts as dysfunctional.

Do you know why this was designed this way?  Why is it different for one textbox vs. multiple text boxes?

In the meantime, I'm seeing what I can do to use the code you offered....will followup later.  I am new to this client-side scripting, and I don't really understand it yet.

0
 
LVL 1

Author Comment

by:Danimal
ID: 6454727
From above:  I am
new to this client-side scripting, and I don't really understand it yet.

p.s.  In other words, I am too ignorant to know what to do with your suggestion without working with it for awhile..  :-)
0
 
LVL 2

Expert Comment

by:MCM
ID: 6455051
I made a mistake in my original suggestion. the code should have been:

onKeyPress="{return (((document.all) : window.event.keyCode ? event.which )!==13)}"

what's happening here is this:

when you hit a key in the text box, it fires an event. there is some default behavior, like printing a letter or submitting the form, but before this behavior happend the developer gets a shot to do whatever s/he feels like. if the code in the onKeyPress returns a value of false, the default behavior is suppressed; if the function returns true, the browser proceeds to do what it was planning on doing.

onKeyPress="return false;"

would always stop keypresses from affecting the text box, while
onKeyPress="return true;"
would never have any effect expect to demonstrate its own lack of effect


in explorer, (window.event.keyCode) refects the ascii value of the key hit, while in navigator, (event.which) contains that value. the existence of the object (document.all) is a good indicator that the user is using explorer, so the innermost piece of the code i proposed tests for document all and returns the value of the key press:

((document.all) : window.event.keyCode ? event.which )

the syntax here is

(  if this expression is true : then return this ? otherwise return this )

so the expression in (a:b?c) here will be equal to the ascii value of the keypress.

then we are returning a value that is true when (a:b?c) is not equal to (the !== operator) 13.

is that fairly clear?



0
 
LVL 1

Author Comment

by:Danimal
ID: 6461070
worked perfect
0

Featured Post

How to run any project with ease

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

Join & Write a Comment

Suggested Solutions

I would like to start this tip/trick by saying Thank You, to all who said that this could not be done, as it forced me to make sure that it could be accomplished. :) To start, I want to make sure everyone understands the importance of utilizing p…
I was asked about the differences between classic ASP and ASP.NET, so let me put them down here, for reference: Let's make the introductions... Classic ASP was launched by Microsoft in 1998 and dynamically generate web pages upon user interact…
It is a freely distributed piece of software for such tasks as photo retouching, image composition and image authoring. It works on many operating systems, in many languages.
Internet Business Fax to Email Made Easy - With eFax Corporate (http://www.enterprise.efax.com), you'll receive a dedicated online fax number, which is used the same way as a typical analog fax number. You'll receive secure faxes in your email, fr…

762 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

22 Experts available now in Live!

Get 1:1 Help Now