[SOLVED] Radio Button won't work in internet explorer but works fine in firefox

Radio Button won't work in internet explorer but works fine in firefox

I have HTML code like so:

function toggle_action(type) {
var tabs = document.getElementsByName("action_tab")
for(var i = 0 ; i < tabs.length; i++){
    //alert(" i = " + i + " length=" + tabs.length );
    if(tabs[i].id == type.value){
        tabs[i].style.display='inline';
    }else{
        tabs[i].style.display='none';
    }
};
}

<div id="action_types">
   <input type="radio" checked name="action_type" value="EmailActionDescription"  onclick="toggle_action(this);"/><label>Email</label>
   <input type="radio" name="action_type" value="TicketActionDescription" onclick="toggle_action(this);"/><label>Ticket</label>
</div>

it works fine in firefox but doesn't work in internet explorer.

any ideas what it could be? the buttons basically display one of 2 options, a ticket or e mail, when clicking on the ticket it just doesn't show.

if you require any further information please let me know.

thanks

Solution

var tabs = document.getElementsByName("action_tab")

First, getElementsByName() is broken in IE. Rather use getElementsByTagName() and/or getElementById(). Or better, use jQuery and $('[name=action_tab]').

Second, this sounds like as <div name="action_tab"> and so on. The HTML <div> element doesn't have a specified name attribute and I doubt if a custom name attribute will work that way in IE with getElementsByName().