Make value of combobox blank

I have a piece of code which makes a combobox active when a checkbox is checked. Once the checkbox is checked I can select a value from the combobox. But I want the combobox to return having no value (blank) once the checkbox is unchecked. How do i do that? My code is as follows:

var tests = [
['Test1'],
['Test3'],
['Test2']
];
Ext.define('Test', {
    extend: 'Ext.data.Model',
    fields: ['test']
});
var testsStore = new Ext.data.Store({
    model: 'Test',
    proxy: {
        type: 'memory',
        reader: {
            type: 'array'
        }
    },
    data: tests
});
var form = Ext.create('Ext.form.Panel', {
    renderTo: document.body,
    bodyPadding: 10,
    width: 550,
    style: 'margin:16px',
    height: 300,
    title: 'Testing example',
    items: [{
        xtype: 'checkboxfield',
        name: 'system',
        boxLabel: 'Production (PACTV)',
        inputValue: 'production',
        listeners: {
            change: function (checkbox, newValue, oldValue, eOpts) {
                var combo = checkbox.up('form').down('combobox');
                if (newValue) {
                    Ext.getCmp('secondComboID').setReadOnly(false);
                    Ext.getCmp('secondComboID').allowBlank = false;
                    Ext.getCmp('secondComboID').validate();
                } else {
                    Ext.getCmp('secondComboID').setReadOnly(true);
                    Ext.getCmp('secondComboID').allowBlank = true;
                    Ext.getCmp('secondComboID').validate();
                }
            }
        }
     }, {
        xtype: 'combobox',
        fieldLabel: 'Select Test',
        readOnly: true,
        id: 'secondComboID',
        store: testsStore,
        valueField: 'id',
        displayField: 'test',
        typeAhead: true,
        forceSelection: true,
        editable: true,
        triggerAction: 'all',
        lastQuery: ''
    }]
});