via Intenta on 11/24/08
FlexiGrid es un ligero datagrid que usa jQuery, con columnas redimensionables, ordenación por columnas, paginación, búsqueda, la capacidad de leer datos en XML o JSON mediante Ajax, etc.
El ejemplo más sencillo sería convertir una tabla en una grid, para ello incluimos tanto la librería jQuery como el javascript de Flexigrid
<script type="text/javascript" src="lib/jquery/jquery.js"></script> <script type="text/javascript" src="flexigrid.js"></script>
El CSS correspondiente, que también viene en el paquete de Flexigrid:
<link rel="stylesheet" type="text/css" href="css/flexigrid/flexigrid.css">
Construimos la tabla:
<table class="clasedelatabla"> <thead> <tr> <th width="100">Col 1</th> <th width="100">Col 2</th> <th width="100">Col 3</th> <th width="300">Col 4</th> </tr> </thead> <tbody> <tr> <td>Dato 1</td> <td>Dato 2</td> <td>Dato 3</td> <td>Dato 4</td> </tr><tr> <td>Dato 1</td> <td>Dato 2</td> <td>Dato 3</td> <td>Dato 4</td> </tr><tr> <td>Dato 1</td> <td>Dato 2</td> <td>Dato 3</td> <td>Dato 4</td> </tr><tr> <td>Dato 1</td> <td>Dato 2</td> <td>Dato 3</td> <td>Dato 4</td> </tr><tr> <td>Dato 1</td> <td>Dato 2</td> <td>Dato 3</td> <td>Dato 4</td> </tr> </tbody> </table>
Ahora tan sólo queda asociar la tabla con la librería.
<script type="text/javascript"> $('.clasedelatabla').flexigrid();
</script>
