/    Sign up×
Community /Pin to ProfileBookmark

Moving between form fields with enter instead of tab?

Copy linkTweet thisAlerts:
Feb 24.2011

Is there a way to set which key/s can be used to move between form elements in an HTML form? Without breaking HTML?

This seems like a weird request to me, but my boss would like it if our workers could use enter to move between form elements on a web application as opposed to tab. I don’t even know if this kind of thing is possible or not.

to post a comment
HTML

2 Comments(s) ↴

Copy linkTweet thisAlerts:
@Big_O_1_Feb 24.2011 — That's weird.. why not just go by the standards?

assuming the HTML is properly laid out, most browsers will submit the form when the enter key is pressed, and will go to the next element when tab is pressed. To override this you will need to use javascript to capture key presses and create your own custom events for them.
Copy linkTweet thisAlerts:
@xvszeroauthorFeb 24.2011 — It's tough to explain. It's an application that used to be in Excel and is being moved to the web. It's not actually a form per se, it's just a bunch of fields that are filled in and then printed. No submit button. And the way the workers here used it in Excel was left hand moves through (paper) files, right hand enters numbers on number pad on right side of keyboard. But there is no quick way to tab between cells with just the right hand.

That's a good point on the enter usually submitting a form though, maybe it isn't a good habit to get people into using it differently anyway. Although I'm already having to make some changes to get it working on the web and at a certain point they will wonder why they're not just using Excel.

Actually the main reason is not everyone who uses this application has Excel, and we don't want to pay for more licenses. But everyone here SHOULD have OpenOffice. They just don't.
×

Success!

Help @xvszero spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 6.16,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @nearjob,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,
)...