Clearing multiple comboboxes and inputfields - Ext JS

Question

I have the following container with a combobox and textField (I also have an add function to dynamically add pairs of combo/textfields):

{ xtype: 'container', layout: 'hbox', style: {margin: '0px 0px 0px 330px'},
   items: [
     { xtype: 'combobox', padding: 5,   id: 'criteria_1_dropdown', store: filters},
     { xtype: 'textfield', padding: 5,  id: 'criteria_1_input', width: 145}
   ] 
 }

And button:

{ xtype: 'button', id: 'clear_criteria', iconCls: 'clear' } 

What I want to do is enable the Clear button to clear any and all combo/textField components on click, I don't believe it needs it's own controller to achieve this. Any ideas?

Answer 1

I solved the issue by putting my form into a variable and resetting that form with the reset() function:

{ xtype: 'button', id: 'clear_criteria', iconCls: 'clear',
     handler: function() { 
         var hi = Ext.getCmp('contain'); 
         hi.getForm().reset(); 
         console.log('Cleared Search'); 
   }  
}