ExtJS
Quelques notes, liens intéressants et posts personnels à propos d’ExtJS :
- Pour précharger les onglets d’un TabPanel :
- l’option deferredRender : false permet de faire le rendu sans attendre de cliquer sur l’onglet.
- la méthode doLayout() : force le calcul du layout et lance le rendu des onglets nouvellement ajoutés.
- Dans un menu avec des sous-menus, pour ignorer les clicks sur un élément parent (ç-à-d qui contient un sous-menu) :
- l’option ignoreParentClicks : true permet d’ignorer les clicks sur un élément parent. Ainsi, le menu ne se ferme pas.
- Screenshot à ajouter.
- Pour relayer un évènement lancé par un composant enfant :
- après l’initialisation : this.relayEvents(composantEnfant, [ 'event1', 'event2' ]);
- l’évènement est déclenché comme si c’était le parent qui l’avait lancé.
- Pour rendre des types complexes dans une grille :
- définir un renderer personnalisé
columns:[ {header: "Titre", width: 40, sortable: true, dataIndex:'title'}, {header: "Publié le", width : 20,sortable:true,dataIndex :'date',renderer:Ext.util.Format.dateRenderer('d/m/Y')}, {header: "Etat", width : 10,sortable:true,dataIndex:'state',renderer:stateRenderer} ] var stateRenderer = function(val) { //traitement sur val, quelque soit son type (array, objet...) return "un texte résultant du traitement" }
- Pour mettre à jour le champ d’un record
- le champ doit être une valeur simple, pas un objet !
-
record.set('champ',valeur);
- on bénéficie automatiquement du mécanisme de dirty records d’Ext.
- Pour styler les lignes d’une grille en fonction d’une propriété du record :
- on définit la fonction getRowStyle sur la vue de la grille. Cette fonction renvoie un nom de classe à ajouter à la ligne.
- Exemple : appliquer la classe read si le champ read est à true, classe unread sinon :
//"this" est la grille this.getView().getRowClass = function(record, index) { return (record.data.read ? 'read' : 'unread'); };