[Kss-devel] how to prevent forms from submitting when I hit Enter?

[Simone Deponti]

Balazs Ree wrote:
> 
> If you want to prevent a form from submitting, you would probably need
> to bind a "submit" event on the form tag, with evt-preventdefault. That
> would be, imo, equivalent to your current javascript fix.
> 
> We have not noticed so far what you point out, and have probably never
> used this event. However, when we implemented the inline editing, we
> noticed that browsers behave unexpectedly with the keypress/down/up event
> and Enter in the submit field. In some cases preventing the form submit
> was rather tricky. This is not because of kss itself but because of
> browser madness: once we have a good pattern that works in javascript, we
> can improve support for it in kss as well.
> 

I worked on this on the Sorrento sprint 2007.
Basically, you should inhibit the default behaviour for the event keypress
and keyup on all the inputs inside the form.

As example (taken from at.kss in Plone):

form.inlineForm input[type="text"].blurrable:keypress {
    evt-keypress-preventdefault: true;
    evt-keypress-keycodes: 13;
    [snip]
}

form.inlineForm input[type="text"].blurrable:keyup {
    evt-keyup-preventdefault: true;
    evt-keyup-keycodes: 13;
    [snip]
}

This is because the default behaviour on text input boxes when a user
presses enter is to submit the form.
However, for some browsers this happens on keypress, for some on keyup, so
you have to "kill" both.

Hope I made any sense: this is however, browser madness, as every browser
reacts to key events in different stages of it.

The theory is:
When a user depresses a key, fire keyDown
While the key is kept depressed, fire keyPress at regular intervals (as
defined by the user in its keyboard settings: this is very client
dependant)
When the key is depressed, fire keyUp

The logic wants that an event such as submit form should be fired on keyUp,
but apparently browsers do have a weird idea of logic.

If I recall correctly, safari had the bad habit to fire it twice, on
keyPress AND keyUp.

So yeah, KSS spares you the burden to write Javascript, but can't fix your
browser (else, everyone would be using KSS and we will forget about
IE6 :D).

-- 
Simone Deponti (shywolf9982)