Solved

Why doesnt my JavaScript code work in Firefox and Chrome but fine in IE?

Posted on 2011-09-02
14
379 Views
Last Modified: 2012-05-12
I have a small JavaScript function which allows a user to press the arrow keys on the keyboard to navigate a html form.  It works fine in IE but it doesnt work at all in Firefox and Chrome and I cant understand why?

Many thanks


function move(cell) {
      x = event.keyCode;

      if (x > 36 && x < 41) {
        var cell = document.getElementById(cell).name; var col = cell.substring(5, 6); var row = cell.substring(2, 4);
        var tab = cell.substring(0, 1);
        switch (x) {
          case 37:
            col = parseFloat(col) - 1;
            document.getElementById(tab + "r" + row + "c" + col).focus();
            break;
          case 38:
            row = parseFloat(row) - 1; 
            row = (row < 10) ? "0" + row : row;
            document.getElementById(tab + "r" + row + "c" + col).focus(); 
            break;
          case 39:
            col = parseFloat(col) + 1;
            document.getElementById(tab + "r" + row + "c" + col).focus();
            break;
          case 40:
            row = parseFloat(row) + 1;
            row = (row < 10) ? "0" + row : row;
            document.getElementById(tab + "r" + row + "c" + col).focus(); 
            break;
        }
      }

Open in new window

0
Comment
Question by:cjohnson300
  • 5
  • 3
  • 2
  • +3
14 Comments
 
LVL 4

Expert Comment

by:mohammad827
ID: 36472293
Normally if this function is called on some event, then that event has to go as in parameter to function. Check using "window.event"
0
 
LVL 17

Expert Comment

by:OmniUnlimited
ID: 36472295
In each of your case statements, you are defining either col or row but not both, and you are using both as your id in your getElementById statement.

Could this be an issue?
0
 

Author Comment

by:cjohnson300
ID: 36472302
OmniUnlimited:  All I can say it works just as I intended in IE!
0
 
LVL 17

Expert Comment

by:OmniUnlimited
ID: 36472304
Sorry, didn't see the entire top statement.
0
 
LVL 17

Expert Comment

by:OmniUnlimited
ID: 36472309
Stupid question, but you do have javascript enabled in both browsers?
0
 

Author Comment

by:cjohnson300
ID: 36472310
Omni: Definitely, all sites (including this one) work fine
0
 
LVL 82

Expert Comment

by:Dave Baldwin
ID: 36472323
When you have this on the screen in Firefox, press Ctl-Shift-J to bring up the error console and Firefox will probably tell you why it's not working.  Chrome has a similar feature.
0
6 Surprising Benefits of Threat Intelligence

All sorts of threat intelligence is available on the web. Intelligence you can learn from, and use to anticipate and prepare for future attacks.

 

Author Comment

by:cjohnson300
ID: 36472344
DaveBaldwin:  Thanks for that, very useful.  I'm getting "event not defined" on the line on the second line?
0
 
LVL 4

Expert Comment

by:mohammad827
ID: 36472357
Did you try window.event?
0
 
LVL 82

Accepted Solution

by:
Dave Baldwin earned 500 total points
ID: 36472360
Look here: http://forums.asp.net/t/1190120.aspx  Firefox and IE don't always do things the same way.
0
 
LVL 17

Expert Comment

by:sonawanekiran
ID: 36472396
You need to check the keycode for  Netscape/Firefox/Opera like

if(window.event) // IE
{
  iKeyCode = objEvent.keyCode
}
else if(objEvent.which) // Netscape/Firefox/Opera
{
  iKeyCode = objEvent.which
}
 alert(iKeyCode);


Details are here http://forums.asp.net/t/1220574.aspx/1
0
 
LVL 29

Expert Comment

by:Badotz
ID: 36472661
How and where is function move(cell) invoked?

Traditionally, the function would be declared as
function move(e){...}

Open in new window

and the element that triggered the event and the event itself are teased out of the parameter "e" like this:
function resolve_event(e) {
    var result = { "source":null, "target":null };
    if (e) {
        result.source = e;
        
        if (result.source.target) { // FF
            result.target = result.source.target;
        }
        else { // IE7+
            result.target = result.source.srcElement;
        }
    }
    else {
        result.source = window.event; 
        result.target = result.source.srcElement;
    }
    if (result.target && result.target.nodeType === 3) { // defeat Safari bug
        result.target = result.target.parentNode;
    }
    return result;
}
//
function move(e) {
    var x = resolve_event(e); // Handle the event
    var who = x.target; // Event sink
    var ev = x.source; // Event object
    ...
    ...
}

Open in new window

0
 

Author Comment

by:cjohnson300
ID: 36472800
Brilliant, it now recognises that key press, many thanks all.

However, now it says:
document.getElementById(tab + "r" + row + "c" + col is null

could it be the double quotes?

0
 

Author Comment

by:cjohnson300
ID: 36472819
my mistake, i'd forgotten to give my form elements ids, i had just given them names

thanks to all who helped points on the way
0

Featured Post

Free Trending Threat Insights Every Day

Enhance your security with threat intelligence from the web. Get trending threat insights on hackers, exploits, and suspicious IP addresses delivered to your inbox with our free Cyber Daily.

Join & Write a Comment

Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
This article discusses how to create an extensible mechanism for linked drop downs.
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)
Google currently has a new report that is in beta and coming soon to Webmaster Tool accounts. This Micro Tutorial will highlight new features for Google Webmaster Tools.

705 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