begin process at 2012 05 28 09:59:02
  Trouver un code source :
 
dans
 
Accueil > 

Code

 > 

Divers

 > EZEDITTABLE

EZEDITTABLE


 Information sur la source

Note :
Aucune note
Catégorie :Divers Classé sous :tableaux, édition, sélection, éditable, tableau éditable Niveau :Initié Date de création :07/04/2011 Date de mise à jour :11/07/2011 13:34:11 Vu / téléchargé :2 290 / 140

Auteur : koalyptus

Ecrire un message privé
Site perso
Ce membre participe au partage de revenus publicitaires
Commentaire sur cette source (6)
Ajouter un commentaire et/ou une note


 Description

ezEditTable est un code open source javascript qui améliore les tableaux HTML en permettant d'éditer le contenu des cellules et en fournissant un modèle de sélection avancé.
Vous pouvez consulter la documentation et les exemples sur: http://edittable.free.fr
Principales caractéristiques:
* Modèle de sélection avancé
* Navigation par clavier
* Edition 'inline' des cellules    
* Ajout et suppression de lignes
* Envoi GET ou POST des modifications au serveur par la soumission de formulaires ou en incluant des éléments de script dans la section d'en tête (seulement GET)
* Intégration avec n'importe quelle technologie côté serveur car il s'agit d'une solution purement côté client
* Possibilité d'utilisation de call-backs pour tous les événements, et de délégués pour la plupart des actions
* Basé que sur du javascript "classique", donc indépendant de toute librairie javascript, mais compatible avec celles-ci (pas de for...in par exemple)
* Documentation et API exhaustive


 Conclusion

Pour plus d'info, n'hésitez pas à vous rendre sur le site de cette ressource:

http://edittable.free.fr
http://editta ble.free.fr/zip.php?f=ezEditTable.zip

 Fichier Zip

Les Membres Club peuvent télécharger directement un fichier contenu dans le zip sans télécharger le zip en entier !

Télécharger le zip


 Historique

07 avril 2011 22:31:25 :
Correction de la description
07 avril 2011 22:37:34 :
Correction de la description
07 avril 2011 22:41:23 :
Ajout de la conclusion
08 avril 2011 16:23:18 :
Modification du titre...
08 avril 2011 16:25:00 :
Modification de la conclusion...
17 avril 2011 20:34:14 :
* Correction de bugs * Ajout d'une démo
26 avril 2011 20:10:10 :
v1.2: * Résolution de bug sous Firefox lors de la soumission multiple au server des lignes du tableau * Amélioré le look de l'éditeur de cellules sous Safari et Chrome * Résolution de bugs mineurs concernant l'éditeur des lignes * Ajout d'une page de démo
16 mai 2011 20:33:11 :
* Ajouté la touche 'home' et 'end' pour la naviagation et la selection * Ajouté 2 callbacks pour la selection: on_validate_row et on_validate_cell, appelées lorsque l'utilisateur double-clique sur la ligne et/ou cellule ou lorsqu'il enfonce la touche 'entrée' * Ajouté le theme 'skyblue'
11 juillet 2011 13:34:12 :
v1.4: * Les cellules peuvent contenir des valeurs vides grace à la propriété allow_empty_value * Correction de bugs

 Sources du même auteur

Source avec Zip HTML TABLE FILTER GENERATOR

 Sources de la même categorie

Source avec Zip Source avec une capture SLIDESHOW IMAGES ET TEXTES EN PUR JAVASCRIPT par ansuzpeorth
Source avec Zip INPUT TEXT AUTOMATIQUE CREATION SUPPRESSION par lycanges
Source avec Zip Source avec une capture TABLE_SV : TABLEAU DYNAMIQUE, MONTRER/CACHER COLONNE SUR DEM... par synanceia
COLONNES ADAPTABLES EN HAUTEUR par dronoide
Source avec Zip VECTEURS ET MATRICES: OUTILS GRAPHIQUES UTILES par william voirol

 Sources en rapport avec celle ci

CONSTRUCTION D'UNE TABLE TRIABLE À PARTIR D'UN TABLEAU 2D par phm
Source avec Zip PERMETTRE LA SÉLECTION DU TEXTE PAR L'UTILISATEUR par jdmcreator
Source avec Zip CALENDRIER ANNUEL UNIVERSEL AVEC SAINTS DU CALENDRIER ET FÊT... par 007Julien
EDITION D'UN CHAMP par macgile
OUTIL DE SÉLECTION par jdmcreator

Commentaires et avis

Commentaire de jdmcreator le 08/04/2011 01:22:27

Ouah :) J'aime bien voir des projets complets sur ce site. Je n'ai pas encore regardé complètement, mais une simple question :

la méthode setEditTable peut-elle accepter autre chose qu'un ID ? Par exemple, directement le tableau ?

Aussi, je me demandais s'il n'y aurait pas de fonction de triage de tableau, ce serait bien aussi ;)

Et finalement, il serait plus "user-friendly" de permettre d'annuler la sélection d'une ligne. Par exemple dans le mode d'édition de ligne, par exemple en cliquant à l'extérieur, ce serait plus intuitif.

Donc je regarde ça de plus près ;)

Commentaire de koalyptus le 08/04/2011 09:00:43

Bonjour JDMCREATOR,
Merci de tes commentaires!
Oui la méthode setEditTable accepte un paramètre obligatoire, le ID d'un tableau html, et 2 autres paramètres optionnels, un objet de config et un int désignant la row de départ de la sélection.
Si non, pour l'instant ce projet se concentre uniquement sur l'édition, la sélection et la navigation par le clavier. En fait le but à terme, ce sera de le "coupler" avec le HTML Table Filter Generator, un autre projet sur les tableaux html, qui lui fournit tout un tas de fonctionnalités de filtrage et aussi de triage de colonnes. Le résultat ce sera, j'espère, un vrai composant de "datagrid"

Commentaire de alex_vino le 08/04/2011 12:30:45

Franchement excellent boulot, très facile d'utilisation, très jolie et surtout très puissant.
Par contre y aurait-il moyen de lier les lignes du tableau avec une base de données (mise à jour auto) ?

Commentaire de koalyptus le 08/04/2011 14:09:23

Merci Alex!
L exemple dans http://edittable.free.fr/demos.php est lié à une bd.
Si non pour ce qui est de la "mise a jour auto" qu'est ce que tu entends exactement? Mettre a jour automatiquement la valeur d une cellule, sans passer par un bouton, mais quand elle perd le "focus" par exemple?
En fait le script actuellement permet l'ajout, la suppression et l'édition de plusieurs lignes à la fois, mais non pas d une cellule uniquement.
Par contre, le script étant complétement ouvert grâce aux call-backs et delegués permets l'implémentation de ses propres alternatives...
J'avoue que pour l'instant ce n'est que le début et qu'il faudra publier d'autres démos pour montrer les potentialités de ce code js.

Commentaire de alex_vino le 08/04/2011 14:46:40

Oui c'est ça Koalyptus, mais ce que ça fait c'est déjà énorme, c'est juste une piste future que je peux te suggérer.
Tu t'es inspiré de GWT ou autres pour le faire ?
En tout cas ce que tu as fait ça fait un bout de temps que je le cherchais, et je voulais pas le faire car je suis loin de ton niveau en language web et j'imagine que tu as passé un bout de temps là-dessus.

Commentaire de koalyptus le 08/04/2011 17:36:51

Merci de ta suggestion, effectivement cela peut être une fonctionnalité intéressante.
Je ne me suis pas inspiré de GWT, je ne connais pas du tout, par contre j'utilise souvent des contrôles de datagrid en .Net dans mon boulot et je voulais juste recréer certaines fonctionnalités de ces contrôles et les fournir dans un contexte complétement délié d'une techno serveur, .Net dans mon cas. Si non j'ai regardé les composants "Sencha", le Tablekit (framework js prototype derrière), dhtmlxGrid et plein d'autres. Bien-sur le résultat n'est pas aussi abouti que certains de ces exemples, mais au moins avec ce petit script on est pas forcé de faire recours à une libraire javascript (jquery, prototype, ExtJs etc.) ;-)

 Ajouter un commentaire


Discussions en rapport avec ce code source dans le forum

Capturer la sélection d'une liste Box [ par OlivierR ] Bonjour tout le monde !Je suis débutant en JavaScript et je voudrais savoir comment capturer le choix de l'utilisateur d'une liste Box. Sa déclaration sélection d'enregistrement par une case à cocher [ par SweetDreams ] Bonjour,A partir d'une liste d'enregistrements(devant chacun une case à cocher), comment arriver à supprimer les enregistrements cochés par un simple Redimensionnement de tableaux sous javascript/netscape [ par Blasteur ] Bonjour à tous!Je souhaite redimensionner dynamiquement un tableau (du nom de 'CESSION') grâce à une fonction javascript.Le problème c'est que le code boîte de sélection [ par tabwarsa ] J'aimerais pouvoir programmer l'affichage d'une boite de sélection (cases d'option) à partir d'un bouton de commande en Visual Basic sur Excel.Comment Sélection dans un textarea [ par bractar ] Bonjour,J'aimerais savoir comment sélectionner (un mot ou+) de textarea pour pouvoir faire des opérations dessus.C'est à dire isoler ce mot et l'envoy sélection direct via un menu déroulant [ par ge_ghost ] je cherche un code de menu déroulant qui me permettrait de sélectionner un site par exemple dans le menu déroulent et que immédiatement cela m'ouvre u Récupérer texte sélectionné dans une iframe éditable [ par shitboypark ] Bonjour,j'utilise une page avec un éditeur wysiwyg(un iframe en fait) qui marche bien..Pour définir le formatage de mon texte, j'utilise l'instruction Les tableaux, dimension automatique! [ par shansen ] salut a tous!alors voila ,j'ai des tableaux comme ca: _________________ | 1 | 2 | |________| | Récupération de code sur une sélection [ par marlysa34 ] Bonjour;J'ai un problème de code, j'ai récupéré celui-ci sur une page web. Le problème est le suivant : quand je clique sur un smileys l'adresse du sm impression dans une autre fenêtre et sélection [ par mlelorra ] BonjourJ'ai une page html contenant un tableau de 20 colonnesJ'aimerais qu'il y ait un bouton ouvrant un petit pop-up (ou une petite fenêtre) qui fera


Nos sponsors


Sondage...

Comparez les prix

CalendriCode

Mai 2012
LMMJVSD
 123456
78910111213
14151617181920
21222324252627
28293031   

Consulter la suite du CalendriCode

Photothèque

A découvrir



 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 0,780 sec (4)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales