Solved

jQuery Form Controls

Posted on 2013-01-31
3
257 Views
Last Modified: 2013-02-01
Hey guys

I need some help with a form that I'm trying to create, with some jQuery controls in place.

The form is laid out in a table gird, with a mixture of <input> and <select> fields.

Some of the <input>'s are using jQuery UI autocomplete, others don't.

I have added arrow key navigation to the sheet, so that users can use the up, down, left, right keys to move to different cells (which is turned off when the autocomplete list is open to let people move up and down in the dropdown list).

The controls that I would like to add are:

1) Enter key - From a data entry stand point, I find the enter key a good way to traverse the different fields in the form.  I would like to have this functionality, without the form submission tied to the enter key (without breaking autocomplete).

2) Form select - Since we are hopefully removing form submission from the enter key, I would like to have a button and/or keyboard combination that submits the form (preferable both, with the obvious choice for the key combo of CTRL-S

Can you please help me.

Thanks
0
Comment
Question by:srfreemaninc
3 Comments
 
LVL 52

Assisted Solution

by:Julian Hansen
Julian Hansen earned 250 total points
ID: 38840433
You will have to capture the keypress event and then check to see what control the event was triggered from. Set a flag if the submit button / control was the origin of the event.

Use a submit handler to trap the submit - if the flag is not set then don't allow the submit to continue (return false / event.preventDefault)
0
 
LVL 11

Accepted Solution

by:
mcnute earned 250 total points
ID: 38840541
You can trigger the enter press by this line of jquery:

$.trigger({ type: 'keypress', which: keycode });

Open in new window


Here are a list of keycodes: http://www.cambiaresearch.com/articles/15/javascript-char-codes-key-codes
0
 

Author Closing Comment

by:srfreemaninc
ID: 38845608
Thanks guys for the help.  Got something working, still need to tweak a few things.
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

This article explains how to prepare an HTML email signature template file containing dynamic placeholders for users' Azure AD data. Furthermore, it explains how to use this file to remotely set up a department-wide email signature policy in Office …
Find out what you should include to make the best professional email signature for your organization.
In this tutorial viewers will learn how to embed videos in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <video> tag to insert a video. Define the src as the URL of your video; this is similar to …
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

895 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

18 Experts available now in Live!

Get 1:1 Help Now