"this" in function onclick for checkboxfield

[smerny]

        
xtype: 'checkboxfield',                    
name: 'exampleName',
id: 'exampleId',
value: 'exampleValue',
label: 'exampleLabel',
 listeners: {
       click: {
               element: 'el',
                fn: function() { 
                       alert("clicked:"+this.name+". checked:"+this.checked+".")
                 }
          }
 }

I want to get "clicked:exampleName. checked:true/false."... but i'm getting "clicked:undefined. checked:undefined", how can get the information that i want?

[smerny]

made a breakpoint with chrome developer tools and went through the var... ended up with this..

alert("clicked:"+this.dom.id+". checked:"+this.dom.lastElementChild.checked+".")

which works... but is this how it should be done?