EXTJS условно скрыть иконку

Question

У меня есть сетка EXTJS с 2 actioncolumns с иконками. Как настроить средство визуализации, чтобы скрыть значок, если IsApproved = true? Я пробовал this.columns [0] .items [0] .icon = ''; но получить ошибку this.columns не определен.

columns: [ 
        { header: 'Name', dataIndex: 'Name', flex: 1 }, 
        { header: 'Login', dataIndex: 'Login', flex: 1 }, 
        { header: 'Registered', dataIndex: 'RegisteredOn', flex: 1 }, 
        { header: 'Invited', dataIndex: 'InvitationSent', flex: 1 }, 
        { xtype: 'actioncolumn', 
         width: 40, 
         header: 'Invite', 
         tdCls: 'clickable', 
         renderer: function (value, metadata, record) { 
          if (record.get('IsApproved')) { 
           //HIDE ICON 
          } else { 
           //SHOW ICON 
          } 
         }, 
         items: [{ 
          icon: '/images/icon_email.png', 
          tooltip: 'Invite', 
          scope: this, 
          handler: this.inviteClick 
         }] 
        }, 
        { xtype: 'actioncolumn', width: 40, header: 'Edit', tdCls: 'clickable', items: [{ 
         icon: '/images/pencil.png', 
         tooltip: 'Edit', 
         scope: this, 
         handler: this.editClick 
        }] 
        } 
       ], 

Answer 1

Попробуйте мой путь - если ваше состояние верно, так что вы положили значок в ячейке, в другой ситуации, вы не:

   { 
        xtype: 'actioncolumn', 
        width: 70, 
        align: 'center', 
        dataIndex: 'yourDataIndex', 
        menuDisabled: 'true', 
        text: 'sometext', 
        sortable: false, 
        fixed: 'true', 
        renderer: function (value, metadata, record) { 
         if (record.get('IsApproved')) { 
          metadata.tdCls = 'mycss' 
         } 
        } 
       } 

и добавить CSS для вашей ситуации:

.mycss { 
    background-position:center !important; 
    width: auto !important; 
    background-repeat: no-repeat; 
    background-image: url("yourIcon.png") !important; 
}