Utilisation de jTable.js avec traitement côté serveur en Java

 Article modifié dernièrement le 13 Juil 2017 @ 1 h 02 min

Nous ne parlerons pas du composant Swing JTable dans ce billet mais plutôt du plugin jQuery jTable qui permet de générer, à partir de données au format JSON, des tableaux riches et ajaxifiés proposant toutes les fonctionnalités d’un CRUD sans avoir à écrire une ligne d’HTML ou de JavaScript.

Les points intéressants

Voici rapidement les principales qualité de ce plugin :

  • Génère le source HTML de votre tableau et charge les données à afficher depuis votre serveur en AJAX
  • Crée automatiquement les actions « ajouter », « supprimer » et « modifier » qui ouvrent une popup Dialog jQuery UI en envoyant l’information du changement au serveur en Ajax et en rafraîchissant le tableau dans le même temps
  • Supporte la pagination et le tri des colonnes côté serveur avec AJAX
  • Permet aux utilisateurs de sélectionner une ou plusieurs lignes du tableau et de modifier à la volée les tailles des colonnes
  • Plusieurs thèmes sont disponibles pour vos tableaux, il est simple de fabriquer soit-même son thème en jouant avec le fichier CSS
  • Fonctionne sur l’ensemble des navigateurs et ne dépend pas d’une technologie côté serveur, tant que les données sont renvoyées au format JSON
  • Expose certains évènement lors de la validation des formulaires et permet l’internationalisation simplement

Traitement serveur en Java

Les exemples fournis dans la documentation en ligne du plugin nous montrent une utilisation avec .NET et PHP, j’ai donc tenté l’expérience en Java en utilisant Spring MVC 3.1 et Jackson 1.9.6 pour la lecture et l’écriture en JSON.

Etant donné que les données qui transitent entre le client et le serveur sont au format JSON, je n’ai eu aucune difficulté à utiliser jTable.js dans une application JavaEE :

Voici en détail le contenu du contrôleur Spring derrière l’action /jtable/list qui permet de retourner les données JSON (avec Jackson) pour que jTable génère un joli tableau :

Attention aux Majuscules

Le seul problème est que jTable requiert une majuscule à la première lettre des clés formant le message JSON :

Or il me semble que la norme JSON impose des minuscules au niveau des clés du message, en tout cas c’est ce que fait Jackson automatiquement et d’autres bibliothèques Java comme Json-lib ou Json-simple.

Voici donc ce que Spring et Jackson génère en sortie et qui ne plait pas à jTable.js (« result » au lieu de « Result », « records » au lieu de « Records ») :

Je n’ai pas trouvé d’autre moyen que de modifier le code JavaScript de jTable.js directement, en changeant data.Result en data.result, data.Records en data.records et data.Message en data.message.

Trois flèches vers le bas

1- Logiciel de brouillage d’adresse IP :

Contourner la censure en surfant anonyme

2- L’article explicatif :

La différence entre un proxy et un VPN

3- Comment espionner un smartphone (app) :

L’application de référence

Commentez ici

  • Nassimou 3 janvier 2013, 3 03

    Salut
    C’est un bon travail juste j’aimerai bien dans la mesure du possible avoir le code source de cet example

  • Mourad 1 juillet 2013, 16 04

    Up pour le post d’en haut, votre article à l’air super mais un petit code source aiderait pas mal à mieux le comprendre s’il vous plait !

Article suivant:

Article précédent:

Share This