autocomplete

[chuchufuentes]

Buenas, estoy usando un autocomplete y funciona bien el problema esta que debajo de ese textbox que estoy usando para el autocomplete, esta un gridview, luego de escribir en el textbox-autocomplete la informacion me la muestra por detrás del gridview, osea que NO puedo ver la información que despliega el autocomplete.
Alguna idea para que salga sobre el gridview, que debo colocar o escribir, o me falta alguna instruccion.
Codigo

<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<div>
<asp:TextBox ID="myTextBox" runat="server" Width="283px" BackColor="White" autocomplete="off" BorderColor="#E0E0E0" BorderStyle="Groove" ForeColor="Black"></asp:TextBox>&nbsp;
<div style="z-index: 101; left: 311px; width: 225px; position: absolute; top: 30px;
height: 37px">
<asp:TextBox ID="txtrecibe" runat="server" Width="211px"></asp:TextBox></div>
<cc1:AutoCompleteExtender ID="AutoCompleteExtender1" runat="server"
targetcontrolid="myTextBox"
servicepath="comple.asmx"
minimumprefixlength="1"
servicemethod="ListaIdentificacion"
completioninterval="250"
enablecaching="true"
OnClientItemSelected="GetCode"
completionsetcount="10"
CompletionListItemCssClass="autocomplete_listItem"
CompletionListHighlightedItemCssClass="autocomplet e_highlightedListItem">
</cc1:AutoCompleteExtender>
</div>
<div style="z-index: 102; left: 8px; width: 330px; position: absolute; top: 89px;
height: 100px">
&nbsp;<asp:GridView ID="dgExpenses" runat="server" AutoGenerateColumns="False" BackColor="Gainsboro"
Width="322px" ForeColor="Black" GridLines="Vertical">
<Columns>
<asp:BoundField DataField="c02casillero" HeaderText="ca" />
<asp:BoundField DataField="c02nombre" HeaderText="nombre" />
<asp:BoundField DataField="c02direccion" HeaderText="direccion" />
</Columns>
<PagerStyle BackColor="Yellow" ForeColor="Maroon" />
</asp:GridView>
</div>
&nbsp;
</form>

Gracias

[jaullo]

Has provado cambiando el z-index, por ejemplo
z-index: 0

[chuchufuentes]

Gracias Jaullo por contestar. Esto es lo que he hecho

<style type="text/css">
.autocomplete_completionListElement
{
visibility :hidden;
margin :0px! important;
background-color :white;
color :blue;
border :solid1pxgray;
cursor :hand;
text-align :left;
list-style-type :none;
font-family :Verdana;
font-size:11px;
padding :0;
z-index :0;
}

/* AutoComplete highlighted item */

.autocomplete_highlightedListItem
{
color :Red;
background-color:#c3ebf9;
padding :1px;z-index :0;
}

/* AutoComplete item */

.autocomplete_listItem
{
padding:1px;
z-index:0;
background-color:#dcdcdc;
}

</style>

El detalle esta en que el autocomplete despliega la información por detrás del gridview y es obvio no se ve nada.
No hay una forma de decirle al gridview go back o al texto bring to front????
Una ayuda mi hermado

[chuchufuentes]

Listo esta es la soluccion de Google

Please set the z-index of the result div to a large value(like 99999), set the position relative, and set the z-index of the other controls to less than the z-index of result div.

dolor de cabeza

[jaullo]

Exacto, creo que el problema anda en el estilo que defines en el div, ya que a pesar de que el autocomplete tiene un css esta dentro de ese div que tiene otro css definido. Podrías checar esta línea para el textbox

Código CSS:

<div style="z-index: 101; left: 311px; width: 225px; position: absolute; top: 30px;
height: 37px">
 

y esta para el grid

Código CSS:

<div style="z-index: 102; left: 8px; width: 330px; position: absolute; top: 89px;
height: 100px">
 

Mira que la diferencia en su z-index es de solo 1. Por lo que casi te aseguro que el problema esta ahi, cambia el valor de uno de ellos a 0 y realiza una prueba.

Luego me cuentas.

Saludos,