Tutoriel ExtJS N°5 : comprendre le Template

////Tutoriel ExtJS N°5 : comprendre le Template

Maîtrisez la notion de Template ExtJS. Utilisez les Template pour créez des modèles pour l’affichage de données. Ajoutez de l’intelligence dans le traitement de ces donnnées avec XTemplate.

Prérequis

 Connaissance HTML, javascript.

 Mise en oeuvre DOM avec ExtJS

Objectifs

 Comprendre notion et valeur ajoutée Template (Ext.template)

 méthodes append, compile

 Comprendre la mise en oeuvre de Template ExtJS

 Comprendre la mise en oeuvre de XTemplate ExtJS

Programme

 Nos petits déjeuners ExtJS

 Introduction

 Partie 1 : Template simple

 Partie 2 : Template complexe

 Partie 3 : XTemplate

Durée

 30min

Lien utile

 Présentation de James Brantly : ExtJS Advanced Templates (Vidéo

Introduction

Ext.template vous permet de créer un modèle de hiérarchie DOM que vous pouvez utiliser par la suite avec des données. Une fois un Template défini, vous pouvez ensuite l’utiliser pour répliquer une ou plusieurs structures DOM.

Les templates sont particulièrement utiles pour des composants tels que Combobox et GridPanel.

Partie 1 : Template simple

tutoriel-extjs-template-2

 

tutoriel-extjs-template-1

Correction

Tutoriel_template_v1

Partie 2 : Template complexe

tutoriel-extjs-template-3

 

tutoriel-extjs-template-4

QUESTION : à quoi sert la méthode compile ? Quand l’utiliser ? Quand a t’elle une valeur ajoutée mesurable ?

Correction

Tutoriel_template_v2

Partie 3 : XTemplate

Imaginez un rendu suivant :

tutoriel-extjs-template-7bis

Pour chaque utilisateur : afficher les informations dont la liste des formations réalisées. Pour les personnes ayant une formation HIBERNATE, ajouter un ‘OK’

 

tutoriel-extjs-template-5

 

tutoriel-extjs-template-6bis

 Expliquez.

Correction

Tutoriel_template_v3

Conclusion

Dans ce tutoriel, vous avez mis en œuvre le concept de ‘template’ dans ExtJS

2018-01-28T12:42:00+01:00

Contactez nous

241 rue DUGUESCLIN, 69003 Lyon

Web : Objis : spécialiste formation Java