Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 1094
  • Last Modified:

Make Tab key behave like Enter key

Thanks in advance for any feedback!

I'm trying to make behave a tab key like an enter key.
The following code works for IE only, but I need to make it work for firefox as well:

<body onkeydown="if(event.keyCode==9){event.keyCode=13; return event.keyCode}">

Firefox does not recognize event.keyCode, so I need to find out what I can use instead.
0
rborda
Asked:
rborda
  • 5
  • 4
  • 2
1 Solution
 
foobarrCommented:
onkeydown="KeyDownHandler(event)"


function KeyDownHandler(event)
            {
                if (event.keyCode == 13 || event.lkeyCode == 9)
                {
                    event.returnValue = false;
                    event.cancel = true;
                    DoSomething()


                   
                }
            }

function DoSomething()
{
....
}
0
 
rbordaAuthor Commented:
foobar: Thank you for your reply, but it doesn't work for me.

 I'm trying to make the last 2 lines of this code work.  Right now the tab key behaves like enter only on IE, but not in firefox cause it does not recognize event.keyCode for me to assign the value of the enter key to it as shown below.

 <script type="text/javascript">
        var obj;
        var TAB = 9;

        function checkKeyPress(evt, elem) {
            obj = elem;
            var keyCode;
            var keyReturn;

            if ("which" in evt) {// NN4 & FF &amp; Opera
                //alert('one');
                keyCode = evt.which;
//                alert(keyCode);
            } else if ("keyCode" in evt) {// Safari & IE4+
                alert('two');
                keyCode = evt.keyCode;
            } else if ("keyCode" in window.event) {// IE4+
                alert('3');
                keyCode = window.event.keyCode;
            } else if ("which" in window.event) {
                alert('4');
                keyCode = evt.which;
            } else { alert("the browser don't support"); }
            if (keyCode == TAB) {
                event.keyCode = 13;     //Enter key code
                return event.keyCode    //make tab behave like enter key
            }
        }

    </script>

0
 
gamarrojgqCommented:
Hi,

FireFox will recognize  evt.which but wont let you change it like IE, what are you trying to do changing the TAB key for an Enter? Submit your form?
0
Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

 
foobarrCommented:
Does you code go into

if (keycode == TAB) ??

If it does instead of setting the keycode = 13 and returning that keyCode

can you just call whatever function you are trying to execute after from within that if block?  




0
 
rbordaAuthor Commented:
Hi gamarrojqq:  

Yes, I'm trying to change the TAB key for an Enter.  This is cause I got an application that recognize an enter press and not a tab when moving from one textbox to another.  This is the reason that when one user presses tab I need to change the behavior to enter.
0
 
gamarrojgqCommented:
ok,  an alternative is to set the focus of the next Textbox when you recognize the TAB, I have tested your script and it enter in the

if (keyCode == TAB) {
                event.keyCode = 13;     //Enter key code
                return event.keyCode    //make tab behave like enter key
            }

But since Firefox wont let you change the keyCode it does not do nothing, but you can to something like this

if (keyCode == TAB) {
               var nextTxtBx = document.getElementById("theIDofyournextTextBox");
               nextTxBx.focus();
            }

However this could work if the number of Textboxes is well know or not too high. If you have dinamically Textboxes or a number higer than Ten I recommend you to use an Array of Textboxes and depending on the ID of the one where the TAB key is pressed, find the next ID and focus it manually
0
 
rbordaAuthor Commented:
Thanks gamarrojqq, but that only makes behave enter key as tab by focusing to the next textbox.  My intention is the other way around to make tab behave like ENTER.  If user presses tab, I want this to behave as the user press the ENTER key.
0
 
gamarrojgqCommented:
ok and if the users does press the Enter Key, what happend? submit the form?
0
 
rbordaAuthor Commented:
It goes to another textbox and initiates the following code which only works when the enter key is pressed and not the tab.
The following code prevents the user from typing on the focused textbox while data is being retrieved for a search.
I got no control over this RequestStart and ResponseEnd since are functions provided with the application it was bought and only responds when user presses enter on the textbox after data is entered to be searched.

        <script type="text/javascript">
            function RequestStart(sender, args) {
                args.EventTargetElement.disabled = true;
            }
            function ResponseEnd(sender, args) {
                args.EventTargetElement.disabled = false;
            }
        </script>
0
 
gamarrojgqCommented:
ok try this, it would call the simulateEnter only if is FireFox, I dont know if your application would recognize the Enter but give it a try


  function checkKeyPress(evt, elem) {
            obj = elem;
            var keyCode;
            var keyReturn;

            if ("which" in evt) {// NN4 & FF &amp; Opera
                simulateEnter(); //make tab behave like enter key
                return true;    
            } else if ("keyCode" in evt) {// Safari & IE4+
                alert('two');
                keyCode = evt.keyCode;
            } else if ("keyCode" in window.event) {// IE4+
                alert('3');
                keyCode = window.event.keyCode;
            } else if ("which" in window.event) {
                alert('4');
                keyCode = evt.which;
            } else { alert("the browser don't support"); }
            if (keyCode == TAB) {
                event.keyCode = 13;     //Enter key code
                return event.keyCode    //make tab behave like enter key                
            }        
        }

function simulateEnter() {
    // Eveant handler for keydown
    document.body.addEventListener('keypress', function(e){}, true);
    //Create new event
    var e = document.createEvent('KeyboardEvent');
    //Init key event
    e.initKeyEvent('keypress', true, true, window, false, false, false, false, 13, 0);
    //Dispatch event into document
    document.body.dispatchEvent(e);
}
0
 
rbordaAuthor Commented:
Gamarrojqq after some testing with a small modification your recommendation worked... Thank you again!!!
        function newKey(event) {
            if (event.which != 0) key = event.which;
            else key = event.keyCode
            if (key == 13) return;
            if (key == 9) {
                var new_event = document.createEvent("KeyEvents");
                new_event.initKeyEvent("keypress", false, true, document.defaultView, false, false, false, false, 13, 13);
                event.preventDefault();
                event.target.dispatchEvent(new_event);
            }
        }
0

Featured Post

Free Tool: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

  • 5
  • 4
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now