EditableGrid disponible sous licence GPL

Posté par  (site web personnel) . Modéré par baud123.
Étiquettes :
26
9
sept.
2010
Internet
EditableGrid est une bibliothèque JavaScript permettant de créer des tables éditables. À l'origine, nous avons développé ce composant pour l'utiliser dans un projet interne. EditableGrid suscitant un certain intérêt, nous en avons factorisé le code afin d'en faire un composant indépendant, réutilisable dans d'autres projets. Nous avons décidé de publier le code source sous licence GPL.

Nous pensons que cette bibliothèque a atteint un niveau de maturité suffisant pour être utilisée en production. Une démo est disponible sur la (courte) page du projet.

EditableGrid n'est pas basée sur jQuery. Cependant, l'utilisation de la bibliothèque de John Resig est vivement recommandée, par exemple pour les callbacks Ajax ou pour développer ses propres validateurs et éditeurs de cellule.

Fonctionnalités principales :

  • Chargement à partir d'un fichier XML ou rattachement à une table HTML existante ;

  • Simplicité d'utilisation et intégration facile dans des applications web existantes ;

  • Chaque colonne est typée (string, integer, double, boolean, url, email, date) ;

  • Les cellules peuvent être éditées avec un éditeur adapté au type de la colonne (ex: checkbox pour boolean) ;

  • Possibilité de déclarer une liste de valeurs possibles pour les cellules d'une colonne (statique ou en JavaScript) ;

  • Gestion de l'unité, de la précision et des valeurs NaN pour les colonnes numériques ;

  • Validateurs intégrés pour les colonnes de type integer, double, url, email et date ;

  • Possibilité de brancher vos propres renderers, éditeurs et validateurs de cellules ;

  • Tri des colonnes (adapté au type) en cliquant sur l'en-tête de colonne ;

  • Binding PHP : construisez le tableau en PHP et laissez-le générer le fichier XML ;

  • Filtrage du tableau ;

  • Ajout et suppression de lignes ;

  • Intégration de Open Flash Chart afin de dessiner des graphiques à partir des données du tableau (le graphique peut suivre en cas d'édition et de tri des données) ;

  • Callbacks pour tous les événements: chargement, édition, tri, etc.


Bien sûr, certaines fonctionnalités restent à implémenter, comme l'utilisation d'un datepicker pour le format date, la pagination côté client, le masquage de colonnes, etc. Nous tâcherons de réaliser tout cela prochainement.

Nous espérons que cette bibliothèque pourra être utile dans vos projets. Tous les commentaires et contributions sont naturellement les bienvenus !

Aller plus loin

  • # compatibilité!

    Posté par  . Évalué à 6.

    Comme je viens de le tester, je précise que ça marche - très bien - avec Konqueror 4.4, Firefox 3.5.11 et Webkit (libwebkit 1.0.2, testé sur Midori 0.2.7).

    Je n'ai pas compris, si l'auteur (merci à lui au passage) recommandes spécialement JQuery, ou si une autre bibliothèque peut faire l'affaire?

    "La liberté est à l'homme ce que les ailes sont à l'oiseau" Jean-Pierre Rosnay

    • [^] # Re: compatibilité!

      Posté par  (site web personnel) . Évalué à 4.

      Merci pour le feedback. En effet nous avons testé et mis au point EditableGrid sur tous les navigateurs dignes de ce nom, mais aussi sur IE7 et IE8 ;)

      EditableGrid ne nécessite aucune librairie (ce qui le rend d'ailleurs d'autant plus facile à intégrer dans n'importe quelle application).

      Par ailleurs, nous recommandons de façon générale vivement jQuery, mais ce n'est nullement obligatoire pour utiliser EditableGrid!

  • # DrasticGrid

    Posté par  . Évalué à 7.

    Un peu dans la même catégorie, j'avais trouvé DrasticGrid ( http://www.drasticdata.nl/DDHome.php?m=3 ) qui affiche des grilles directement reliées à des bases MySQL qui sont mises à jour quand l'utilisateur modifie la grille.

    Et en plus, j'ai un peu contribué au au projet :-)

  • # Sous IE6

    Posté par  . Évalué à 4.

    Ca marche aussi, et c'est tant mieux, car dans le groupe qui m'emploie, on est encore scotché à cette version (et ce navigateur) pour les 2 prochaines années.

    Sinon, le filtrage n'est pas activé sur la démo, ou c'est moi qui n'ait pas trouvé comme on s'en sert ?

    • [^] # Re: Sous IE6

      Posté par  (site web personnel) . Évalué à 3.

      Content d'apprendre que ça marche aussi sur sur IE6 ! (nous ne testons plus sur ce navigateur)

      En effet, le filtrage n'est pas activé dans la démo (nous allons y remédier...).

  • # Dans la todo list

    Posté par  . Évalué à 1.

    Et hop dans ma todo list test, y a des chances qu'il me serve... vite et bien.
    Merci !

    Nehki Cool

  • # Pour ceux que ca interesse

    Posté par  . Évalué à 5.

    Bonjour,

    J'ai également dévelopé un composant tableau similaire dans le cadre de mon framework JavaScript que vous pouvez voir sur cette page de démo: http://www.zeleos.org/zwt/V0.2.1/Samples/Zeleos-TestSuite/or(...) (onglet table).

    L'API en JavaScript est pas mal flexible et permet d'étendre pas mal de fonctionnalité du tableau.

    En ce moment je suis à la recherche d'utilisateurs pour avoir des feedbacks donc tout commentaire constructif serait le bienvenu.

  • # Copier - coller inter-appli ?

    Posté par  . Évalué à 3.

    Je suis allé voir la démo est je suis impressionné.

    Je préviens: je ne connais pas grand chose au Javascript et rien du tout aux APIs offertes par les navigateur pour interagir avec l'OS/l navigateur.

    Serait-il facile de proposer des copier-coller gardant le format des cellules:

    - entre deux instances différentes de l'appli utilisant cette librairie ?
    - entre une instance de l'appli utilisant cette librairie et une appli native de l'OS (genre copier coller vers / depuis OpenOffice). ?

    Je suppose qu'il y a du boulot pour la deuxième option, car cela exige de gérer l'API presse papier de l'OS hôte voir du bureau hôte (KDE, Gnome, etc...).

    Mais pour la première option, entre deux onglets de FF ou de Opera par exemple, serait-ce relativement facile à faire ou bien là aussi un travail de titan ?

  • # Démo intégration OpenFlashChart

    Posté par  (site web personnel) . Évalué à 4.

    Nous venons d'améliorer la démo pour vous montrer l'intégration avec OpenFlashChart.

    N'hésitez pas à éditer des cellules, trier le tableau ou supprimer des lignes...le graphique suit comme par magie!

  • # Version Non Compressée !

    Posté par  . Évalué à 4.

    Bravo pour votre initiative !
    J'ai longtemps cherché ce genre de chose sans jamais être réellement convaincu par les solutions trouvé !
    Cependant il serait peut-être judicieux de livrer une version développeur (non compressée) afin de mieux étudier son fonctionnement !
    Merci pour votre contribution !

    • [^] # Re: Version Non Compressée !

      Posté par  (site web personnel) . Évalué à 4.

      C'est vrai que c'est une version compressée dans l'archive. Nous allons changer ça desuite. Mais de toute façon, tout le projet peut être récupéré via le dépôt Git sur GitHub.

    • [^] # Re: Version Non Compressée !

      Posté par  (site web personnel) . Évalué à 3.

      L'archive téléchargeable sur la page du projet contient désormais les sources.
      Cette archive est également disponible sur la page Téléchargements de notre compte GitHub.
      Bien entendu, les toutes dernières sources sont à tout moment consultables sur GitHub.

  • # DHTMLx

    Posté par  (site web personnel) . Évalué à 1.

    Je ne cherche pas à prouver qu'il y a mieux ailleurs, mais pour ceux que cela intéresse, il y a la suite de composants DHTMx qui fournit entre autres des tables dynamiques http://dhtmlx.com/

    Alexandre COLLIGNON

    • [^] # Re: DHTMLx

      Posté par  (site web personnel) . Évalué à 2.

      Et il y a aussi extjs (http://www.sencha.com/products/js/) qui propose des tables éditables. Donc oui, il y a surement mieux ailleurs.

      Mais la richesse de l'OpenSoure réside surtout dans la liberté pour l'utilisateur de choisir le composant qui lui convient le mieux. Donc plus il y a de choix mieux c'est je pense.

      Les différences ? La licence par exemple. DHTMLx est en dual licence. La taille peut-être ? dhtmlxSuite.zip fait 15,8mo au téléchargement.

  • # Licence

    Posté par  . Évalué à 1.

    Si j'ai bien lu, cette bibliothèque est sous licence GPL. Si j'ai bien tout compris, on ne peut pas utiliser une bibliothèque en GPL dans une application non libre.
    J'ai pas tout compris ou j'ai tout faux ? ^_^'

    • [^] # Re: Licence

      Posté par  . Évalué à 2.

      Oui, une application qui utilise une bibliothèque sous licence GPL et qui est dépendante de celle-ci pour fonctionner (ie il y a des appels directs à son API) doit elle aussi placée sous GPL. Ça pose un problème ? :)

Suivre le flux des commentaires

Note : les commentaires appartiennent à celles et ceux qui les ont postés. Nous n’en sommes pas responsables.