Navigate table rows using arrow keys

Discussion in 'Javascript' started by skipc@valley.net, Aug 26, 2005.

  1. Guest

    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, 2005
    #1
    1. Advertising

  2. tom Guest

    tom, Aug 26, 2005
    #2
    1. Advertising

  3. Guest

    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, 2005
    #3
  4. RobG Guest

    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_Get-key-press-event-using-JavaScript.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
     
    RobG, Aug 27, 2005
    #4
  5. ASM Guest

    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
     
    ASM, Aug 27, 2005
    #5
  6. RobG Guest

    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
     
    RobG, Aug 28, 2005
    #6
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Rob R. Ainscough
    Replies:
    0
    Views:
    715
    Rob R. Ainscough
    Jul 20, 2005
  2. (Pete Cresswell)
    Replies:
    2
    Views:
    591
    (Pete Cresswell)
    Oct 12, 2004
  3. Vidar Gundersen
    Replies:
    1
    Views:
    791
  4. PJ6
    Replies:
    2
    Views:
    110
  5. sylver
    Replies:
    4
    Views:
    192
    sylver
    Aug 2, 2007
Loading...

Share This Page