views:

1741

answers:

4

When an AutoCompleteExtender is displayed in IE6 it seems to ignore z-index and renders below any select controls (like dropdownlists) in IE6.

<asp:TextBox ID="TextBox1" runat="server"  />
<cc1:AutoCompleteExtender ID="AutoCompleteExtender1" runat="server" 
    TargetControlID="TextBox1" EnableCaching="true" CompletionSetCount="5" 
    FirstRowSelected="true" ServicePath="~/Services/Service1.asmx" ServiceMethod="GetSuggestion" />
<asp:DropDownList ID="DropDownList1" runat="server">
    <asp:ListItem Text="Item 1" Value="0" />
    <asp:ListItem Text="Item 2" Value="1" />
</asp:DropDownList>

How do I make it render above dropdownlists?

+1  A: 

Nothing renders below select controls in IE6. It's one of the many "features" microsoft bestowed upon us when they gifted IE to the world

You have to hide them, then re-show them.

Observe the standard lightbox script - which does exactly this

(note that link is just to the first thing I found on google which had the source to lightbox.js as a demonstration. It's got nothing to do with anything else)

Orion Edwards
A: 

@Orion has this partially correct - there is one other way to deal with these, and that is to cover the offending select lists with an iframe. This technique is used in Cody Lindley's ThickBox (written for jQuery). See the code for details on how to do it.

Jason Bunting
Although I haven't got it to work 100%, this is the solution which I have got closest with and proceeds with.
Geir-Tore Lindsve
Let me know if you need particular help, I have working code I could probably share with you that would simplify things...If I remember and get time, I will try to post it here - but no promises! Contact me via email if you can, see my website, etc. Seek and you shall find.
Jason Bunting
A: 

Hello there,

I have the same problem than Geir-Tore Lindsve and I searche a lot but I really wonder where to fire this (out of lightbox's script:

$$('select', 'object', 'embed').each(function(node){ node.style.visibility = 'hidden' });

Finally, is it the only line of code needed?

Thanks guys for your help.

A: 

I also found this trick but I wonder if it would work since autocompleteextender creates an "on the fly" sub div. Knowing that, I just cannot see where or when to append the following code:

<div class="select-free"><!--[if lte IE 6.5]><iframe></iframe><![endif]--></div>

Can anyone help me on this please?

Regards.