How to change color of a textfield using ExtJS

background-colorextjstextfield

I would like to change the color of a ExtJS textfield, but I don´t succeed. The label is the component that gets the color:

var textfield= Ext.create('Ext.form.Text', 
    {
        id: 'textfield',
        name: 'name',
        fieldLabel: 'Name',
        style: 'background-color: #ddd;',
        allowBlank: false,
    });

Ext.create('Ext.form.Panel', {
    title: 'Contact Info',
    width: 300,
    bodyPadding: 10,
    renderTo: Ext.getBody(),
    items: [textfield]
});

Example:
http://jsfiddle.net/3ZZcZ/

How do I change the color?

Best Solution

You need to set fieldStyle instead of style. You also need to override the Ext JS default, which sets a background image on the field. Like this:

fieldStyle: 'background-color: #ddd; background-image: none;'
Related Question