Discussion :

[Bruno13]

Bonjour à tous,

Dans ma grille, j'utilise un XTemplate:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
            columns     : [
                {
                    xtype       : 'templatecolumn',
                    tooltip     : 'Image View',
                    flex        : 1,
                    tpl         : new Ext.XTemplate(
                                         ....
                                         {name:this.getImage()}
                                         ....,
                                         getImage: function(val, meta, rec) {
                                                     .....
                                         }
                   )
                }
           ]

ce template doit afficher une image ou rien.
Je dois interroger une base tiers qui me renvoie non pas un lien mais l'image elle-même.
(Il n'existe pas de lien html vers cette image)
Je dois donc tout d'abord sauvegarder l'image sur mon serveur puis créer le lien html.
(bien sûr si l'image a déjà été récupérée, je renvoie directement le lien sans interroger la base tiers)

Ce processus prend du temps, et j'aimerai le lancer au moment de la visu de ma grille uniquement.

Comment puis je intégrer un fireEvent dans ma fonction getImage de mon template ?

j'ai déjà fait cela dans un Handler d'un bouton, j'associe le fireEvent à ma formDialog

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
                    buttons         : [
                    {
                        text        : 'Ok',
                        ui          : 'blue-button',
                        cls         : 'btnOk',
                        height      : 30,
                        formBind    : true,
                        disabled    : true,
                        handler: function(b,e) {
                            var formDialog = b.up('contactform');
                            var form = b.up('form');
                            // fire custom event for the controller to handle
                            formDialog.fireEvent('contact', formDialog, form, form.getValues());
                        } // handler
                    } // ok button
                    ] // buttons

Dans le cas de mon XTemplate et plus précisement dans mon getImage
à quel composant je dois associé le fireEvent ? (pour qu'ensuite je puisse gérer le download dans mon Controller, puis via un fly modifier
ma div contient {name:this.getImage()}.

D'avance merci pour votre aide,
Bruno

[Bruno13]

Ok alors voilà comment j'ai résolu mon problème:

1. j'ai défini un id dans ma templatecolone:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
            columns     : [
                {
                    xtype       : 'templatecolumn',
                    id          : 'configpicture',

dans mon XTemplate, je fais:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
                        '  <div id="img{pn}" style="font-family: Arial; font-size:12px; font-color:#C0C0C0">',
                        '   <tpl for=".">',
                        '     {[this.getFPC(values.pn, values.lfpc, values.nfpc, values.ffpc)]}',
                        '   </tpl>',
                        '  </div>',

et enfin je définis ma function de mon XTemplate

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
                            getFPC: function(pn, lfpc, nfpc, ffpc) {
                                var mycol = Ext.getCmp('configpicture');
                                mycol.fireEvent('getfpc', pn, lfpc, nfpc, ffpc);
                            }

j'écoute donc la "colonne" dans mon Controller, dans this.control

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
            '#configpicture': {
                getfpc  : this.onGetFPC
            }
 
 
...
...
 
    onGetFPC : function(pn, lfpc, nfpc, ffpc) {
 
        console.log(pn);
        console.log(lfpc);
        console.log(nfpc);
        console.log(ffpc);

Seul soucis à mon code le Ext.fly que j'ajoute à la suite pour récupérer l'id ne fonctionne pas, il renvoie null...

bizarre mais je vais trouver je pense