0

In an html form, I want a certain field to be invisible when "no" is checked and visible when "yes" is checked.

This is my code:

html:

<form action="pageName.html" method="post" name="formName">
    Question?
        <input name="radioBool" type="radio" value="1" onchange="dispField('textInput');" />yes
        <input name="radioBool" type="radio" value="0" onchange="dispField('textInput');" />no
    <br />
    <span id="textInput" style="display:none">
        Specify: <input name="specify" type="text" />
    </span>
</form>

javascript:

function dispField(htmlID) {
    if (document.formName.radioBool[0].checked == true) {
        document.getElementById(htmlID).style.display = "";
    }
    else {
        document.getElementById(htmlID).style.display = "none";
    }
}

This seems to work perfectly across all browsers except for IE (latest version).

In IE the only problem is that the radio buttons have to lose focus before the span will change to visible. I would like the "specify" field to display immediately after the radio button changes to yes, rather than waiting for the buttons to lose focus.

Thanks,
David

2
Contributors
2
Replies
4
Views
7 Years
Discussion Span
Last Post by nizuya
0

That works! I didn't even try it because I figured it wouldn't trigger if someone was tabbing / arrowing through the form. Thanks.
-David

This question has already been answered. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.