ExtJs. Comment faire pour CSS pour case à cocher dans fieldpanel

Question

Je dois changer la vue de case à cocher dans un fieldpanel. Mais je n'ai pas trouvé où je peux définir le style CSS pour cela. Mon code ressemble à ceci

{ 
    xtype: 'fieldset' 
    ,title:'<font size="3"><spring:message code="title"/></font>' 
    ,collapsible:true 
    ,checkboxToggle: true 
    ,collapsed: true 
    ,margin: 5 
    ,border: 0 
    ,items: [{..}] 
} 

screenshot

what I need

Answer 1

Ceci est la solution que je pouvais trouver. Utilisez fieldset avec checkboxgroup. Si vous insérez la disposition dom de case à cocher, vous verrez qu'il est de type bouton avec l'image de fond des cases à cocher répétées. Par conséquent, si vous voulez changer le style de case à cocher, vous devrez également changer l'image de fond.

{     
       xtype:'fieldset', 
       columnWidth: 0.5, 
       title: 'Fieldset 1', 
       collapsible: true,     
       defaults: {anchor: '100%'}, 
       layout: 'anchor', 
       items :[ 
         { 
          xtype: 'checkboxgroup',       
          // Arrange checkboxes into one column, distributed vertically 
          cls : 'checkboxOverride',        
          columns: 1, 
          vertical: true, 
          items: [ 
           { boxLabel: 'Item 1', name: 'rb', inputValue: '1' }, 
           { boxLabel: 'Item 2', name: 'rb', inputValue: '2', checked: true }, 
           { boxLabel: 'Item 3', name: 'rb', inputValue: '3' }         
          ] 
         } 
        ] 

     } 

Dans add CSS,

.checkboxOverride{ 
    border-color: blue; 
} 

.checkboxOverride .x-form-checkbox{ 
    border-color: blue; 
    background-repeat: no-repeat; 
    background-image: url("checkbox_unchecked.png");  
    width: 50px; 
    height: 50px; 
    margin: 20px; 
    padding: 20px; 
    vertical-align: middle; 
} 
.checkboxOverride .x-form-field{ 
    color: blue; 

} 
.checkboxOverride .x-form-cb-checked .x-form-checkbox { 
    background-image: url("checkbox_checked.png"); 
    background-position: 0 0px; 
} 

Résultat ressemblera

Merci à this stackoverflow post