Link to home
Start Free TrialLog in
Avatar of David Megnin
David MegninFlag for United States of America

asked on

JavaScript not setting ASP.NET RadioButtonList in IE, but works fine in FireFox

The JavaScript function "selects" the first ListItem in the RadioButtonList radBarrier if the first ListItem in radBarrier is selected, otherwise it unselects it.

* This works fine in FireFox v40.x and IE 11 with Compatibility View on.
** With Compatibility View off in IE 11, the selection works fine but the unselection does not work.  
*** I need to make it work in IE 11 without Compatibility View since the 22 Computers where this is displayed are not running in Compatibility view.  Thanks.  :-)

    // This sets "radBarrier" to YES if "radVeteran" 'Veteran' is selected.  Otherwise should unselect radVeteran.
    function SetHaveDisability(QuestionID)
    {
    	var rad = QuestionID;
    	var rbl = document.getElementById(rad);  //  The whole RadioButtonList Control
    	var rbl_0 = document.getElementById(rad + '_0');  //  "Disabled Veteran"
    	if (rbl_0.checked)
    	{
    		document.getElementById("radBarrier_0").checked = true;
    	} else
    	{
    	    document.getElementById("radBarrier_0").checked = false;
    	}
    }

Open in new window



                        <asp:RadioButtonList ID="radVeteran" runat="server" RepeatDirection="Horizontal" RepeatLayout="Flow" onclick=" SetHaveDisability(this.id); ">
                            <asp:ListItem Value="Veteran" Text="Disabled Veteran" />
                            <asp:ListItem Value="Dependant" Text="Eligible Spouse of a Veteran" />
                            <asp:ListItem Value="Care Giver" Text="Care Giver of an ill, injured, or disabled Veteran" />
                            <asp:ListItem Value="Neither" Text="None of those." />
                        </asp:RadioButtonList>

Open in new window


                    <asp:RadioButtonList ID="radBarrier" runat="server" RepeatDirection="Horizontal"
                        onclick="ShowHideBarrier(this.id);" RepeatLayout="Flow">
                        <asp:ListItem Value="Yes" Text="Yes" />
                        <asp:ListItem Value="No" Text="No" />
                        <asp:ListItem Value="DA" Text="N/A" />
                    </asp:RadioButtonList>

Open in new window

Avatar of Dave Baldwin
Dave Baldwin
Flag of United States of America image

We need to see what's in the "View Source".  Everything that starts with 'asp' is run on the server to produce something in the browser.  We need to see what the browser sees.  A link would be good.
Avatar of David Megnin

ASKER

Yes, I agree.  ;-)  My first thought was to right-click the page and "view source" just for that information.  I don't know what I have on the page that's preventing a "right-click dialog" from popping up, but I can right-click the "splash screen" page, but not the page I'm having the issue with.
The Developer Tools in FireFox and Chrome have evolved to the point that I can't make heads or tails of them anymore.  Can't find a simple "view source" in either of them.  Anyway, I know this isn't helping you help me one bit.  ;-)

I did get it to work after turning on Compatibility view and then when I turned it off, it still worked.  Odd.  I think there is some unwanted caching going on in my browser.

It's an internal application for customers to sign in at our front door.  It's not accessible from outside our network.

Is there another way to reference ASP.Net controls that is more reliable that just document.getElementById("theID")?
ASKER CERTIFIED SOLUTION
Avatar of Dave Baldwin
Dave Baldwin
Flag of United States of America image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Ctrl-U  !   Thank you!

Okay the source is showing the id to be consistent with the way I'm referencing to selectable ListItems, i.e. "radBarrier_0", "radBarrier_1", etc:
<span id="radBarrier" onclick="ShowHideBarrier(this.id);"><input id="radBarrier_0" type="radio" name="radBarrier" value="Yes" /><label for="radBarrier_0">Yes</label><input id="radBarrier_1" type="radio" name="radBarrier" value="No" /><label for="radBarrier_1">No</label><input id="radBarrier_2" type="radio" name="radBarrier" value="DA" /><label for="radBarrier_2">N/A</label></span>
               
It is actually working in my IE 11 browser now.  It's one of those odd issues that make me just hate Microsoft products.  ;-)
Originally this worked:
document.getElementById("radBarrier_0").checked = true;

and this didn't:
document.getElementById("radBarrier_0").checked = false;

And there's no reasonable explanation for the second one to not work if the first one does.  Anyway they do both work now.  
I guess I don't have an issue any longer.  If you have any other feedback, I'd love to hear it, otherwise let me know you're done and I'll accept your input as the final answer.

Thank you for responding to my question.
Glad to help but I have no idea why it started working.
Thanks again.  Ctrl-U allowed me to get to the source and see what was going on there.