Foro de elhacker.net

Programación => Desarrollo Web => Mensaje iniciado por: jasonkilian en 4 Marzo 2015, 13:07 pm



Título: Seleccionar un GridView con jquery
Publicado por: jasonkilian en 4 Marzo 2015, 13:07 pm
Buenas, estoy intentando seleccionar un GridView con un selector Jquery para poder cambiar el color de una fila cuando paso el ratón por encima.

Lo he probado con:

Código:
$(document).ready(function() {       
            $("table tr:has(td)").css({ background: "ffffff" }).hover(
                function() { $(this).css({ background: "#C1DAD7" }); },
                function() { $(this).css({ background: "#ffffff" }); }
                );
        });

El problema es que así me colorea cualquier tabla que tengo en la web.


Si le añado el ID del gridview no me funciona:

Código:
$(document).ready(function () {
         $("#GridView1 table tr:has(td)").mouseover(function (event) {
             $(this).css({ background: "#ffffff" });
         });
         $("#GridView1 table tr:has(td)").mouseout(function (event) {
             $(this).css({ background: "#f6aa4c" });
         });
     });

Alguna posible solución?

Gracias, un saludo


Título: Re: Seleccionar un GridView con jquery
Publicado por: EFEX en 4 Marzo 2015, 18:46 pm
Define un #id a la tabla y solo aplica la propiedad css a esa tabla.


Título: Re: Seleccionar un GridView con jquery
Publicado por: jasonkilian en 5 Marzo 2015, 00:33 am
No entiendo..., ¿a qué tabla?


Título: Re: Seleccionar un GridView con jquery
Publicado por: Usuario Invitado en 5 Marzo 2015, 01:20 am
Asignale un id a tu tabla y realiza el css deseado. Por ejemplo:

Código:
<table class="table" id="table-users">
    <thead>
        <tr>
            <th>ID</th>
            <th>Nombres</th>
            <th>Apellidos</th>
            <th>F. Nacimiento</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>1</td>
            <td>Juana</td>
            <td>Urresti Echevarría</td>
        </tr>
    </tbody>
</table>
.

Y desde CSS aplicas el estilo deseado. Por ejemplo:

Código
  1. #table-users > tbody tr:hover {
  2.    background-color: #f5f5f5;
  3. }


Título: Re: Seleccionar un GridView con jquery
Publicado por: jasonkilian en 5 Marzo 2015, 11:27 am
El problema es que el "estilo" que quiero aplicar lo quiero aplicar al GridView. En ningún momento defino una tabla al definir el gridview. El código que tengo con el gv es el siguiente:

Código:
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
        DataKeyNames="IDJugador" DataSourceID="SqlDataSource1"
        Font-Name="Verdana"  BackColor="#cccccc"
        HeaderStyle-Height="35px" ItemStyle-Height="35px" Font-Size="10pt"
        Cellpadding="4" HeaderStyle-BackColor="#444444" HeaderStyle-ForeColor="White"
         RowStyle-BackColor="#cc0000" >
<Columns>
....
.....
....
....
</Columns>
    </asp:GridView>

Y lo que quiero es que al pasar el ratón por encima de una fila del gridview, ésta cambie de color. Me gustaría implementarlo además con jquery. Estoy bastante perdido, gracias.


Título: Re: Seleccionar un GridView con jquery
Publicado por: jasonkilian en 5 Marzo 2015, 12:18 pm
Resuelto, gracias