Crea una griglia di azione Extjs 4 con testo?

Question

come creare una colonna di azione della griglia ExtJs 4 con testo? questo è il mio codice

{ 
    xtype : 'actioncolumn', 
    text : lang('publish'), 
    width : 100, 
    tdCls: 'x-publish-cell', 
    items : [{ 
     getClass : function(v, meta, rec) { 
      if (rec.get('isPublished') == true) { 
       //this.items[0].tooltip = 'Test'; 
       return 'y'; 
      } else { 
       return 'n'; 
      } 
     } 
    } 

Come creare colonna azione ExtJs 4 griglia con il testo?

Answer 1

È possibile utilizzare il numero renderer della colonna. Il trucco è che Ext specificamente nasconde una regola CSS per nascondere il contenuto delle colonne d'azione:

.x-grid-cell-inner-action-col { 
    line-height: 0; 
    font-size: 0; 
} 

in modo da avere per compensare questo.

Esempio:

{ 
    xtype:'actioncolumn', 
    renderer: function() { 
     return 
      '<div style="float:right; font-size: 13px; line-height: 1em;">' 
       + 'Hey!' 
      + '</div>' 
    }, 
    items: [ 
     // ... 
    ] 
} 

Qui ho usato stile in linea, ma una classe CSS personalizzata probabilmente sarebbe meglio.

Ora che consente di aggiungere del testo alla colonna. Se ciò che si desidera ottenere è aggiungere del testo per azione n. nella colonna, sarà necessario sostituire lo Ext.grid.column.Action#defaultRenderer.