Des boutons dans un Ext.grid.GridPanel

Ca n'est pas aussi simple qu'on pourrait le penser. J'ai d'abord ajouté une colonne avec un renderer qui génère des divs dans les cellules :

{header: "", width: 70, dataIndex: '', renderer: function(){
 return '<div class="btn" style="height: 11px; width: 60px"></div>';}
}

J'ai ensuite ajouté un listener sur le GridPanel.

listeners: {
    render: {
        fn: function(grid){
            var view = grid.getView();
            for (var i = 0; i < store.getCount(); i++) {
                var cell = Ext.fly(view.getCell(i, 2));
                new Ext.Button({
                    handler: function(){
                        alert('Suppression')
                    },
                    renderTo: cell.child(".btn"),
                    text: 'Supprimer'
                });
            }
        },
        delay: 200
    }
}

L'astuce réside ici dans le paramètre delay qui permet de retarder le handler de 200 ms. Sans cela, le code ne fonctionne pas parce que les lignes ne sont pas encore affichées quand la grille envoie son événement render. C'est pas mal, mais j'ai encore un problème d'affichage dans Firefox : La suite au prochain numéro...