Handsontable tablas con javascritpt, jquery, angular.js al estilo excel

Handsontable tablas con javascritpt, jquery, angular.js al estilo excel, este plugin tiene la facilidad de mostrarnos la información mediante tablas similares a la funcionalidad que tiene las hojas de excel.

Este plugin tiene compatibilidad con backbone.js, jquery, bootstrap, raphael.js y angular.js, además tiene compatibilidad con:

1.- Ajax

2.- Trabaja conjuntamente con datos en formato json

3.- Tiene eventos que permiten realizar operaciones entre celdas.

4.- Aplica propiedades a celdas.

5.- Maneja tipos de celdas (Ejem. numérica, fecha, checkbox, select, dropdown, auto complementario,password).

6.- Permite tener el control del documento con el teclado.

7.- Maneja validaciones entre celdas.

8.- Permite la búsqueda de palabras entre las celdas.

La integración puedes encontrarla en el siguiente enlace:
Cell types: http://handsontable.com/demo/renderers.html

Validación: http://handsontable.com/demo/validation.html

Fecha: http://handsontable.com/demo/date.html

http://handsontable.com/

Para incluir está librería, simplemente hay que agregar el siguiente código.

Vamos a crear unas cuantas líneas, primero integramos lo que son las dependencias:

<script src="handsontable/lib/jquery.min.js"><script>
<script src="handsontable/dist/handsontable.full.js"></script>
<link rel="stylesheet" media="screen" href="handsontable/dist/handsontable.full.css" />

Posteriormente el siguiente código:

function getData() {
return [
["", "Kia", "Nissan", "Toyota", "Honda"],
["2008", 10, 11, 12, 13],
["2009", 20, 11, 14, 13],
["2010", 30, 15, 12, 13]
];
}
// Instead of creating a new Handsontable instance with the container element passed as an argument,
// you can simply call .handsontable method on a jQuery DOM object.
var $container = $("#hot");
$container.handsontable({
data: getData(),
startRows: 5,
startCols: 5,
minRows: 5,
minCols: 5,
maxRows: 10,
maxCols: 10,
rowHeaders: true,
colHeaders: true,
minSpareRows: 1,
contextMenu: true
});
// This way, you can access Handsontable api methods by passing their names as an argument, e.g.:
var hotInstance = $("#hot").handsontable('getInstance');

The post Handsontable tablas con javascritpt, jquery, angular.js al estilo excel appeared first on Develoteca.