SortTable Ordena tus tablas facilmente

enero 31, 2008

En una ocación requería poder permitir al usuario ordenar una tabla en la que presento cierta información, pero queria hacerlo sin tener que ir al servidor ya que no son tantos registros, entonces empece a buscar y probar hasta que di con este espectacular Script que tan solo con 17Kb sin comprimir permite el ordenamiento de las tablas con Javascript de forma facil y muy ajustable a nuestro diseño del sitio.

Como apicar SortTable a nuestra página.

Es tan sencillo como adicionar la libreria a nuestro sitio y adicionar una class a la tabla que necesitamos sea ordenable.

Dentro de las etiquetas <HEAD> ponemos

<script src="sorttable.js"></script>

y luego en la definicion de la tabla ponemos

<table class="sortable">

y eso es todo. Para más personalización podemos modiicar la hoja de estilos para que se adapte mas a nuestro diseño.

/* Sortable tables */
table.sortable thead {
    background-color:#eee;
    color:#666666;
    font-weight: bold;
    cursor: default;
}

y listo,  ahora nuestra tabla permite ordenarse dando click sobre el titulo de la columna.

Esta librería tiene muchas más aplicaciones, el objetivo de este corto post  es unicamente informar del uso de esta librería, y tambien a mi me sirve como anotación para recordar la url y como se aplica.

Si necesitas más información acerca de esta excelente librería de Javascript ve directamente al sitio de Sorttable dando click aqui.

Anuncios

One Response to “SortTable Ordena tus tablas facilmente”

  1. Martín Says:

    Intenté usar esto, con datos q provienen de una consulta, pero únicamente me ordena x la primera columna de la tabla. Sin importar el encabezado sobre el q haga click, el único campo q utiliza para el orden es el d la primera columna.

    Alguna sugerencia???


Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s

A %d blogueros les gusta esto: