473,508 Members | 2,143 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

Navigate table rows using arrow keys

Hi,

I am stuck... I've got a popup window that displays a list in table
format with links on the bottom to navigate the list <prev> 1 2 3 ...
<next>

When I demo'd to the users... they immediately asked if they could use
the arrow keys and enter key to navigate the list. I think there must
be a way to do this, but I can't figure it out.

Has anyone out there done this? I would like to keep the mouse
navigation but add the ability to navigate using the keyboard.

Thanks! D

Aug 26 '05 #1
5 18195
tom
Yes, you can do that...

yo need to capture the key pressed by user, i recommend check this
page, there you can find the way to do that

http://www.geekpedia.com/tutorial138...avaScript.html

After you have gotten the key, you can move the focus from one link to
another, in a little javascript function.

regards,
Tom

Aug 26 '05 #2
Tom,
Thanks. That helps. I think I've got all the pieces. I think I have to
figure out which row in the table the user is on, add or decrement and
focus on the new row. I will keep working on it.

-D

Aug 26 '05 #3
tom wrote:
Yes, you can do that...

yo need to capture the key pressed by user, i recommend check this
page, there you can find the way to do that

http://www.geekpedia.com/tutorial138...avaScript.html


That script could be somewhat more compact as:

<script type="text/javascript">

var keys = { 16:'shift', 17:'Ctrl', 18:'Alt', 19:'Pause',
37:'Arrow Left', 38:'Arrow Up', 39:'Arrow Right',
40:'Arrow Down'
}

function KeyCheck( e ) {
var msg = document.getElementById('xx');
var e = e || event ;
msg.innerHTML = keys[e.keyCode] || '';
}

</script>
</head>
<body onkeyup="KeyCheck(event);">
<p>The key you pressed was:
c</p>
</body>
[...]
--
Rob
Aug 27 '05 #4
ASM
RobG wrote:
That script could be somewhat more compact as:

<script type="text/javascript">

var keys = { 16:'shift', 17:'Ctrl', 18:'Alt', 19:'Pause',
37:'Arrow Left', 38:'Arrow Up', 39:'Arrow Right',
40:'Arrow Down'
}
Waou ! wonderful !
Is it an array ? object ? whatelse ?
function KeyCheck( e ) {
var msg = document.getElementById('xx');
var e = e || event ;
msg.innerHTML = keys[e.keyCode] || '';
msg.innerHTML = keys[e.keyCode] || e.keyCode;

would be instersting to see some key codes :-)
}

</script>
</head>
<body onkeyup="KeyCheck(event);">
<p>The key you pressed was:
c</p>
</body>


document.getElementById('xx') outside with the dog ?
--
Stephane Moriaux et son [moins] vieux Mac
Aug 27 '05 #5
ASM wrote:
RobG wrote:
That script could be somewhat more compact as:

<script type="text/javascript">

var keys = { 16:'shift', 17:'Ctrl', 18:'Alt', 19:'Pause',
37:'Arrow Left', 38:'Arrow Up', 39:'Arrow Right',
40:'Arrow Down'
}

Waou ! wonderful !
Is it an array ? object ? whatelse ?


I think it's an object, my browser agrees. ;-)

Another way is:

var keys = new Object();
keys[16] = 'shift';
keys[17] = 'Ctrl';
...

But I like my way 'cos it's much more concise, though sometimes the
longer method is better for maintenance reasons 'cos it's a bit more
readable.

I'm sure there's a French equivalent for 'to each her own'. All I can
think of is 'Que sera sera' which doesn't seem appropriate...

[...]
document.getElementById('xx') outside with the dog ?


If I had a dog it would have died of a persecution complex long ago. it
seems my fingers forgot to type everything my brain told them to.

"I've done my homework, I just haven't written it down yet" :-x

--
Rob
Aug 28 '05 #6

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

4
3271
by: jeffsal | last post by:
I am using sorttable.js to sort a table which works fine which allows a user to sort the table by clicking on the column header. Is there some code I could add to the page (onload or something) to...
1
2619
by: cotton_gear | last post by:
Hello, Fiest of all let me thank this group for so quick in responding to any postings. I am using a javascript based utility from a site to sort the columns of the table. But, for some strange...
4
5837
by: Neil Wallace | last post by:
Hi there, I have an application in which a grid of 100 or more buttons are put on a form in columns of 10. All the buttons are within a panel. They are added in runtime, and so they adopt a...
33
2433
by: Geoff Jones | last post by:
Hiya I have a DataTable containing thousands of records. Each record has a primary key field called "ID" and another field called "PRODUCT" I want to retrieve the rows that satisy the following...
2
3782
by: PJ6 | last post by:
When I hit an arrow key, I want to be able to change the focus from cell to cell just like in Excel. I see two ways of doing this. First, emitting in script a function call in each cell on key down...
2
5469
by: Gil | last post by:
hello. i would like to navigate my form with arrow keys by jumping to the next control or previous control when ever i hit the up,down, left or right key. this works fine as long as i do not...
3
2995
by: almurph | last post by:
Hi, I'm a newbie to Javascript. I can;t even finf a full API for it! Anyway I have a table structure and when a user presses the down-arrow button the item in said table is meant to be...
2
5021
by: divingIn | last post by:
Hi, I have created a textbox like google suggest(or like yahoomail) that shows results using ajax as you type in. Now i am showing the results in a dynamic table under the textbox inside a div. But...
4
1635
by: Mecena | last post by:
Hi! I'm using arrow keys to navigate thru controls and I want my tab control to implement that feature too, so when tabpage gets entered (focus is on the header) DOWN key should focus on first...
0
7124
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
7326
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
0
7385
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
1
7046
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...
0
7498
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...
0
5629
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...
0
4707
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and...
0
1558
by: 6302768590 | last post by:
Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated ...
0
418
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.