Below is the XML format:

Code:
<customers>	<customer>
		<name>Customer1</name>
	</customer>
	<customer>
		<name>Customer2</name>
	</customer>
	<customer>
		<name>Customer3</name>
	</customer>
</customers>

I want to load the customer names in a combo reading the above XML file. Below is the code I tried:


Code:
Ext.require('Ext.tab.*');

Ext.define('Customer',{
    extend: 'Ext.data.Model',
    fields: [
        { name: 'name', type: 'string' }
    ]
});


var customerStore = Ext.create('Ext.data.XmlStore', {
	autoLoad: true,
    url: '/XML/xml/customer.xml',
    fields: ['name'],
    record: 'customer'
});


Ext.define('CustomerCombo', {
    extend: 'Ext.form.field.ComboBox',
    alias: 'widget.customercombo',
    allowBlank: false,
    queryMode: 'local',
    valueField: 'id',
    displayField: 'name',
    store: customerStore
});


Ext.onReady(function(){
	Ext.tip.QuickTipManager.init();
    Ext.widget('panel', {
    	renderTo: 'pan1',
        title: 'Basic Panel',
        width:600,
        height:100,
        defaults: {
            bodyPadding: 10,
            border: false,
            xtype: 'panel',
            layout: 'anchor'
        },
    	layout: 'hbox',
    	pack: 'end',
        items: [{
            	  fieldLabel: 'Customer',
            	  xtype: 'customercombo',
            	  width: 234,
            	  margin: '5 5 5 5'
               }]            
    });  
});
But the code is not working. The Drop down is empty and an exception is thrown in Chrome console:

Uncaught TypeError: Cannot call method 'indexOf' of undefined

Please help

Regards,