CODEWITHSUNDEEP
javascriptfirefoxradio-buttonsetfocus
Slacker616
Slacker616

Reputation: 855

javascript radio button focus doesn't work on firefox?

I'm using a form to get information from the user, and i am also using some radio buttons and textarea's, if the user hasn't picked an option from the radio buttons i want to focus that radio button so the user can know what data is missing. I've tried:

document.FORM.RADIOBUTTON[INDEX].focus();

and it actually works well in google chrome, but for some reason it doesn't work on firefox, i tried to use a setTimeout(.....); and again, it does work on google chrome but i don't get anything in firefox. any ideas in how to get this to work?

Upvotes: 0

Views: 4621

Answers (3)

Bob
Bob

Reputation: 21

I think the missing outline in Firefox is the issue, I know it was for me. I added some CSS and got it to show. 

input:focus 
{
  outline:#000 dotted 1px; 
}    
select:focus
{
  outline:#000 dotted 1px; 
}

Upvotes: 1

Tariqulazam
Tariqulazam

Reputation: 4585

It indeed works in firefox but the issue is the focused item is not highlighted in firefox. If you try to navigate the next DOM element using tab key, you will find it works. Some styling can be applied to element but DOM element styling also differ from browser to browser. See an example here http://jsfiddle.net/uQ3vk/

Upvotes: 3

nnnnnn
nnnnnn

Reputation: 150080

Without seeing your HTML the best option I can suggest is to give your radio buttons (or at least the one(s) you want to be able to focus programmatically) an ID:

<input type="radio" id="radio1" name="someradiogroup" value="somevalue">
<input type="radio" id="radio2" name="someradiogroup" value="someothervalue">

<script>
document.getElementById("radio1").focus();
</script>

As with any programmatic access to DOM elements your code won't work if the element(s) haven't been parsed yet, so the code should be either in the document.ready / onload handler or later in the source than the element(s) in question. (Or in a submit handler, assuming a submit won't happen before the page loads.)

Upvotes: 2

Related Questions