Wednesday, December 11, 2013

[Rails] Re: How can I prevent ENTER from submitting form?

Thanks for that Adam, helped me a lot.

On Saturday, January 10, 2009 1:10:15 AM UTC+10, Adam Massive wrote:
Ok ok, stop.. just stop... you're all making it too complicated.
[shakes head]


Let's go over things...
You want a button that submits normally but want to try and stop the
enter key submitting it.  To do this, you're going to need to understand
the relationship between the ENTER key, the Mousebutton and Javascript.

When you press ENTER in a form, the form automatically goes to the first
Submit button it can find (or usually the closest in accordance to
tabindexing) and then submits the form.  It treats the ENTER key like it
was the left mouse button because it has to assume that some people
don't have a mouse (partially sighted, screen readers etc).

In Javascript, when you press ENTER in a form, it also relates this to
the left mouse button being clicked, which therefor activates the
"onclick" event. It also sets a keycode (13) so it knows what key on the
keyboard was pressed.

However, Javascript has another event called "onmousedown" which only
works if the mouse button is pressed down. It doesn't get related to the
keyboard or the ENTER key. I believe onkeydown is for that.

Now!, the onmousedown event is activated before the onclick method which
means we have a way of setting a rule before doing anything with
onclick. (Onclick doesn't activate until you let go of the clicked
button).

So, the easiest solution (if we don't do anything fancy with functions)
is to apply two javascript events to your submit button.

Example
==============
<input type="submit" name="mybutton" onmousedown="this.title=1"
onclick="if(this.title!=1){return false;}" value="Submit my Form" />


How it works?
==============
What happens is.. if you click the button, the onmousedown event runs
first which renames/sets the title of the button. When you let go of the
mousebutton, the onclick takes effect and checks the title to see if its
set to 1. If it is, then it submits, otherwise it returns false.

This means that, if you pressed ENTER, onmousedown wouldn't have renamed
the title which means the onclick will return false and not submit the
form.

Obviously, as I know the Mootools library I've made a transparent method
which just adds the two events to all input=submit buttons on the page.
The inline example here is just to show you the method for copying and
pasting quickly :)

Hope that helps someone!
Adam
www.greatbigmassive.net

--
Posted via http://www.ruby-forum.com/.

--
You received this message because you are subscribed to the Google Groups "Ruby on Rails: Talk" group.
To unsubscribe from this group and stop receiving emails from it, send an email to rubyonrails-talk+unsubscribe@googlegroups.com.
To post to this group, send email to rubyonrails-talk@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/rubyonrails-talk/9700e089-59f5-4e7a-b870-8ed0ca05e4a8%40googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.

0 Comments:

Post a Comment

Subscribe to Post Comments [Atom]

<< Home


Real Estate