z-index

[Stephen McCrea]

I have a page of several labels, textboxes, buttons and a dropdown list box.

When I want to display an error, I overlay a panel (make it visible) with a
high z-index so that it covers all the other controls. Except that it never
covers the drop-down list box. Despite the fact that the list box has a
lower z-index it always shows through.

I have tried manipulating the visibility of the list box but have run into
problems making it visible again after making it invisible.

Is this a feature of HTML or asp.net?

Thank you,

 

[Scott G.]

This is kind of an HTML/browser implementation thing; for IE check out:

http://support.microsoft.com/default.aspx?scid=kb;en-us;177378

There are some HTC (IE specific) that can kind of workaround this; I can't find the URL, but do some googling and it will turn up.

And you could write some Javascript to "disable" the input elements (i.e. "message is on, then turn off the windowed controls").

Scott
I have a page of several labels, textboxes, buttons and a dropdown list box.

When I want to display an error, I overlay a panel (make it visible) with a
high z-index so that it covers all the other controls. Except that it never
covers the drop-down list box. Despite the fact that the list box has a
lower z-index it always shows through.

I have tried manipulating the visibility of the list box but have run into
problems making it visible again after making it invisible.

Is this a feature of HTML or asp.net?

Thank you,

 

[Robert Koritnik]

Yes yes. A very "popular" and known problem or at least "bad-mood-creator".
The thing is that windowed controls like DropDown or ListBox are render the
last. The same goes for ActiveX objects included on the page (if any).

There are techniques that can be used to "prevent" this (at leas it looks
like it's prevented), but nothing will be easy.

Browsers do this way: They first render HTML and controls that they know how
to do it, then they leave it to the platform (windows) to display those that
they don't (dropdowns etc). that's why these controls are always displayed
on top. Because they are ALWAYS rendered last. This explanation may not be
100% correct but it's perfectly understandable and hold enough truth.
These things are still from earlier versions when CSS didn't exist. Neither
JS was as powerful (if I may say it today?) as it is today...

Solution?
1.
Looks like IFRAMES are a thing to go. IFRAME has something from the both
worlds (I think from IE V6 on - but your code may also work perfectly well
in V5). You can set its z-order and it actually displays OVER any windowed
controls. You can fill it's content from your page dynamicaly or
declaratively. Check out the web for any samples. And further details on
this issue.
2.
You could find some already prepared server controls that act as if they
were real dropdown but are a bunch of DHTML+CSS but they work as they
should. Some of them. You could develop even your own for your own needs and
purposes... And this may be even a better approach since they are reusable.
And if you make/find one that is really good, you'll never use the
aspropDownList server control ever.