Solved

getElementById javascript set focus error in FireFox

Posted on 2008-06-20
7
7,369 Views
Last Modified: 2013-12-07
The following properly sets the focus to the input field being tested in IE, Opera, and Safari (Windows). It does not work in Firefox; instead the focus goes to wherever you sent it in order to leave the field.

In the form:  
<input type="text" size="3" name="RS_damage_roof" id="RS_damage_roof" value="0" class="num"
                                          onblur="javascript:check_val('RS_damage_roof','0,1,2,3,4,5');">

The javascript:
// Check value entered in a field
function check_val(fname,okay) {
      var thefield = document.getElementById(fname);
      var val = thefield.value;
      var okval = okay.split(',');
      for (var i=0;i<okval.length;i++) {
            if (val === okval[i] ) return true;
      }
   alert("Please enter one of these values: " + okay);
   thefield.focus();
}
0
Comment
Question by:Roland_F
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 3
7 Comments
 
LVL 16

Expert Comment

by:CWS (haripriya)
ID: 21831311
Try this:

 var thefield = document.getElementById('RS_damage_roof');

or try this:

var thefield = fname;
0
 
LVL 41

Accepted Solution

by:
HonorGod earned 125 total points
ID: 21831395
In the past, I have gotten around this by having a function
to setFocusOn( id ), and using a slight delay to invoke it..

  //------------------------------------------------------------------
  // Name: focusOn( id )
  // Role: Provide a way to delay the field.focus() request
  // Note: The Gecko engine (Mozilla, Firefox, et.al.) may throw an
  //       uncatchable excption "Permission denied".  This has
  //       supposedly been fixed in Firefox 1.5.1
  //------------------------------------------------------------------
  function focusOn( id ) {
    var field = document.getElementById( id );
    if ( field ) {
      field.focus();    // May throw "Permission denied" (uncatchable)
    } else {
      alert( 'unknown section id "' + id + '"' );
    }
  }

...

 setTimeout( 'focusOn("myField")', 10 );
0
 

Author Comment

by:Roland_F
ID: 21832856
I had to go read about setTimeout to find out why I needed to define another function, then I had to figure out how to use my field id, which for me is in a variable because I'm dealing with a lot of fields -- both of these were very reasonable things to leave for me to figure out. My code is now working in FireFox. Thanks.
0
Get 15 Days FREE Full-Featured Trial

Benefit from a mission critical IT monitoring with Monitis Premium or get it FREE for your entry level monitoring needs.
-Over 200,000 users
-More than 300,000 websites monitored
-Used in 197 countries
-Recommended by 98% of users

 
LVL 41

Expert Comment

by:HonorGod
ID: 21833568
So, is there anything else that is needed, or is this question answered?
0
 

Author Comment

by:Roland_F
ID: 21835222
I thought "Accept as solution" meant it was answered. Yes, it is.  I accepted your answer as the solution.  I thought.
0
 

Author Closing Comment

by:Roland_F
ID: 31469156
See my earlier comment. The solution was complete enough for me to figure out the rest.
0
 
LVL 41

Expert Comment

by:HonorGod
ID: 21835691
Glad to be able to help.  Thanks for the grade & points.

Good luck & have a great day
0

Featured Post

Optimize your web performance

What's in the eBook?
- Full list of reasons for poor performance
- Ultimate measures to speed things up
- Primary web monitoring types
- KPIs you should be monitoring in order to increase your ROI

Question has a verified solution.

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

This article will inform Clients about common and important expectations from the freelancers (Experts) who are looking at your Gig.
When crafting your “Why Us” page, there are a plethora of pitfalls to avoid. Follow these five tips, and you’ll be well on your way to creating an effective page.
This Micro Tutorial will demonstrate how nuggets on the Web are formatted by using Chrome Developer Tools. These tools would not only view the site's CSS but it can also modify it and save the CSS to use on your own site.
The is a quite short video tutorial. In this video, I'm going to show you how to create self-host WordPress blog with free hosting service.

623 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