Thanks for the help, its woking fine.
I modified the xml with namespaces for each and every element like this:
Code:
<c:customers> <e:customer>
<p:name>Customer1</p:name>
</e:customer>
<e:customer>
<p:name>Customer2</p:name>
</e:customer>
<e:customer>
<p:name>Customer3</p:name>
</e:customer>
</c:customers>
And modified the code like this:
Code:
Ext.define('Customer', { extend : 'Ext.data.Model',
fields : [
{ name : 'p:name', type : 'string' }
]
});
Ext.define('CustomerCombo', {
extend : 'Ext.form.field.ComboBox',
alias : 'widget.customercombo',
allowBlank : false,
queryMode : 'local',
valueField : 'id',
displayField : 'p:name'
});
Ext.onReady(function() {
var customerStore = Ext.create('Ext.data.Store', {
autoLoad : true,
model : 'Customer',
proxy : {
type : 'ajax',
url : '/XML/xml/customer.xml',
reader : {
type : 'xml',
record : 'e:customer'
}
}
});
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',
store : customerStore
}
]
});
});
But did not work again.
Initially thought that with or without namespace, the code should be same by changing the names only but its not like that 
Any help on this please?