Applied style=“display:none” in not working in IE but working Mozilla

Question

I have tried to apply style=\"display:none\" in (e.g test), this is working per

Answer 1

Internet Explorer will (sadly) not hide option elements.

You can, however, store the list contents elsewhere and remove() it. Restore from list later if need be.

Answer 2

Nothing is going wrong; that is the way IE behaves. There is not a lot of styling you can do to individual options.

It's probably best to remove the option from the select element entirely using JavaScript if you don't want it shown in the select.

Answer 3

More accurate answer for "why styles attributes not working for IE" is -- It depends on which version of IE and what browser you are using!

The fact that not all styles of display work for all browsers, you just have to try each one of them to find out which one works for your browser or you have to even include testing what browser your app is running on in your code .

!

See below for example: the javascript ".display = 'inline'" only works for IE 8 and up.

<script type="text/javascript">
function f_ToggleCheck(sender, rowN, obj2) {
    if (sender.checked) {
        sender.value = "checked";
        obj2[rowN].style.display = "inline";
    } else {
        sender.value = "";
        obj2[rowN].style.display = "none";
    }
    alert(obj2[rowN].style.display);
}
</script>

<table>
    <tr>
        <td>
            <input name="R_CheckValue" type="checkbox" onclick="f_ToggleCheck(this, 2, R_DateValue)" value="checked" checked="" />
            <input name="R_DateValue" value="2015-05-30" style="display: inherit" size="7" />
        </td>
    </tr>
</table>

Answer 4

For anyone having to deal with hiding option elements in those versions affected, I posted a workaround here which doesn't clone or remove the options but wraps spans around them, which is arguably much easier to deal with:

http://work.arounds.org/issue/96/option-elements-do-not-hide-in-IE/

Answer 5

Options are part of select tags and not all browsers support hiding of options using css. Try removing the option completely and add them again later if you want to.