Mejor JavaScript dinámico / JQuery Grid [cerrado]

87

Estoy trabajando con JavaScript, JQuery y HTML. La interfaz de usuario de mi proyecto es completamente dinámica. Estoy buscando un JavaScript / JQuery Grid dinámico que admita las siguientes funciones.

¿Alguien puede decirme si hay alguna cuadrícula de fuentes abiertas de buen aspecto que admita las siguientes características?

  1. Debería poder crear una instancia de la cuadrícula en tiempo de ejecución y agregarla a DOM.
  2. Admite plantillas de columna (cuadro de texto, selección, casilla de verificación o cualquier entrada o texto simple)
  3. Admite establecer una nueva plantilla de columna o reemplazar la plantilla de columna existente en tiempo real.
  4. Pocos controles de entrada (por ejemplo, cuadro de texto, casilla de verificación ...) presentes debajo de una columna pueden estar habilitados y pocos pueden estar deshabilitados .
  5. Soporta setData () en tiempo real.
  6. Admite eventos si el usuario cambia algún dato de entrada.
  7. Debe admitir la selección de una fila
  8. Agregue o elimine el soporte de filas en tiempo real sin representar la cuadrícula completa.
  9. Soporta paginación.
  10. Admite la clasificación por cualquier columna en tiempo real.
  11. Activa un evento si los datos están ordenados por usuario en tiempo real.
  12. La interfaz de usuario de la cuadrícula debe admitir columnas realizables
  13. Redimensionable automáticamente (será genial si la cuadrícula se redimensiona automáticamente según el tamaño del elemento principal)
  14. Definitivamente tiene buena documentación.
javascript jquery grid Somnath
fuente
7
Escríbalo usted mismo. Si desea todas esas funciones, debe hacerlo usted mismo. La solución personalizada es siempre la mejor solución.
Raynos
28
No estoy seguro de que sea siempre la mejor solución. Quiero decir, no voy a construir mi propio motor de base de datos en lugar de usar InnoDB ...
Grim ...
2
@Roynos, yo mismo he escrito algunas cosas, pero necesito invertir mucho tiempo para implementar todas las funciones como ordenar, cambiar el tamaño, etc., así que estoy buscando un control de cuadrícula. Todavía estoy evaluando todas las cuadrículas una por una.
Somnath
22
@Raynos Eso es ridículo. La mejor solución es la que funciona al menor costo. ¿Por qué construirlo si ya está hecho?
Richard
@RichardDesLonde tienes razón. Mi opción es seleccionar la mejor solución existente y ampliarla según sus necesidades.
Somnath

Respuestas:

42

Algunos útiles son:

Gratis:

Pagado:

Las mejores entradas en mi opinión son Flexigrid y jQuery Grid.

Soham
fuente
Hasta ahora me empezó a gustar jQuery Grid. trirand.com/blog/jqgrid/jqgrid.html Pero aún no estoy seguro. Mantenerlo actualizado ...
Somnath
@Somnath - ¿Es jQuery grid con el que estabas más feliz? Tengo una necesidad similar y he estado evaluando DataTables, pero agregar filas (y hacer que formen parte del orden de clasificación) no funciona bien.
MattW
@MattW Sí, me gusta jQuery Grid. Agregar datos es muy fácil. También puede hacer que cada columna se pueda ordenar simplemente colocando una bandera. Mi lista de requisitos era realmente grande. Pero pocas cosas las construyo yo mismo y en algunos casos estoy usando jQuery Grid. También consiguió una API genial y fácil. En este momento estoy contento con jQuery Grid. Es bueno.
Somnath
@Somnath Entonces, finalmente, ¿cuál elegiste? El encabezado DataTable también es una buena opción. Cual es el mas rapido? ¿Y cuál admite la agrupación?
Vivek Vardhan
@VivekVardhan estoy usando trirand.com/blog/jqgrid/jqgrid.html
Somnath
38

puedes probar http://datatables.net/

DataTables es un complemento para la biblioteca jQuery Javascript. Es una herramienta muy flexible, basada en las bases de la mejora progresiva, que agregará controles de interacción avanzados a cualquier tabla HTML. Características clave:

  • Paginación de longitud variable
  • Filtrado sobre la marcha
  • Clasificación de varias columnas con detección de tipo de datos
  • Manejo inteligente de anchos de columna
  • Muestra datos de casi cualquier fuente de datos
  • DOM, matriz de Javascript, archivo Ajax y procesamiento del lado del servidor (PHP, C #, Perl, Ruby, AIR, Gears, etc.)
  • Opciones de desplazamiento para la ventana gráfica de la tabla
  • Totalmente internacionalizable
  • Compatibilidad con jQuery UI ThemeRoller
  • Sólido como una roca: respaldado por un conjunto de más de 2600 pruebas unitarias
  • Amplia variedad de complementos incluidos. TableTools, FixedColumns, KeyTable y más
  • ¡Es gratis!
  • Ahorro estatal
  • Columnas ocultas
  • Creación dinámica de tablas
  • Carga automática de datos Ajax
  • Posicionamiento DOM personalizado
  • Filtrado de una sola columna
  • Tipos de paginación alternativos
  • Interacción DOM no destructiva
  • Ordenar columna (s) destacando
  • Opciones avanzadas de fuente de datos
  • Amplia compatibilidad con complementos
  • Clasificación, detección de tipo, funciones API, paginación y filtrado
  • Totalmente tematizable por CSS
  • Documentación sólida
  • 110+ ejemplos prediseñados
  • Soporte completo para Adobe AIR
enclavado
fuente
3
Formatee correctamente las funciones clave. No use solo copiar / pegar. ¿Tiene que leerlo una vez después de copiar / pegar?
¿Qué significa "interacción DOM no destructiva"? Tener dificultades para entender por qué esto es novedoso o una característica, y qué cubre / garantiza.
John Zabroski
1
@John ya no se menciona en la página vinculada, pero si busca en la web esa oración, encontrará "El mayor cambio en la v1.4 es la interacción DOM no destructiva. Lo que esto significa es que DataTables no sobrescribirá los elementos de la tabla para realizar sus funciones (¡verdadera mejora progresiva!), más bien mueve los elementos. En v1.3 y antes de que creara dinámicamente el HTML requerido para el tbody en cada dibujo, este ya no es el caso. La ventaja inmediata es que todos los atributos (clases, etc.) de la tabla original se conservan [...] "
CodeCaster
5
no es software libre creo, mmm, un problema con él.
David
4
Parece que estas geniales cuadrículas de DataTables no son editables, y si las necesita, debe pagar por la versión editable: editor.datatables.net/purchase/index
yetanothercoder
8

Mi sugerencia para JQuery Grid dinámico está a continuación.

http://reconstrukt.com/ingrid/

https://github.com/mleibman/SlickGrid

http://www.datatables.net/index

El mejor es:

DataTables es un complemento para la biblioteca jQuery Javascript. Es una herramienta muy flexible, basada en las bases de la mejora progresiva, que agregará controles de interacción avanzados a cualquier tabla HTML.

Paginación de longitud variable

Filtrado sobre la marcha

Clasificación de varias columnas con detección de tipo de datos

Manejo inteligente de anchos de columna

Muestra datos de casi cualquier fuente de datos

DOM, matriz de Javascript, archivo Ajax y procesamiento del lado del servidor (PHP, C #, Perl, Ruby, AIR, Gears, etc.)

Opciones de desplazamiento para la ventana gráfica de la tabla

Totalmente internacionalizable

Compatibilidad con jQuery UI ThemeRoller

Sólido como una roca: respaldado por un conjunto de más de 2600 pruebas unitarias

Amplia variedad de complementos incluidos. TableTools, FixedColumns, KeyTable y más

Creación dinámica de tablas

Carga automática de datos Ajax

Posicionamiento DOM personalizado

Filtrado de una sola columna

Tipos de paginación alternativos

Interacción DOM no destructiva

Ordenar columna (s) destacando

Opciones avanzadas de fuente de datos

Amplia compatibilidad con complementos

Clasificación, detección de tipo, funciones API, paginación y filtrado

Totalmente tematizable por CSS

Documentación sólida

110+ ejemplos prediseñados

Soporte completo para Adobe AIR


fuente
5

Eche un vistazo a agiletoolkit.org, ya que tiene un CRUD fácil de usar que admite 2,4,6,7,9,10 y 12 de fábrica (usa Ajax para defender la cuadrícula al agregar, eliminar datos y se integra jquery.

Publicaría algunos ejemplos, pero en un iPad por el momento.

Trevor North
fuente