Question

I have a editable FormPanel that looks like this:

I now want to display the same form but so that the data is merely viewable instead of editable, i.e. instead of in textboxes, the data is simply displayed as text.

I can change the defaultType from textfield to panel but then the data isn’t displayed at all.

What type of defaultType do I need so that the data value is simply displayed as text instead of in an input box?

var simple_form = new Ext.FormPanel({
    labelWidth: 75,
    frame:true,
    title: 'Customer Information',
    bodyStyle:'padding:5px 5px 0',
    width: 600,
    height: 600,
    autoScroll: true,
    defaults: {width: 230},
    defaultType: 'textfield',
    items: [{
            fieldLabel: 'Item 1',
            name: 'item1',
            allowBlank:false,
            value: 'test'
        },{
            fieldLabel: 'Item 2',
            name: 'item2',
            value: 'test'
        },{
            fieldLabel: 'Item 3',
            name: 'item3',
            value: 'test'
        }, {
            fieldLabel: 'Item 4',
            name: 'item4',
            value: 'test'
            ...

Answer 1

Use Ext.form.DisplayField. The API describes DisplayField as:

A display-only text field which is not
validated and not submitted.

Set your defaultType to defaultType: 'displayfield', and the value property to the text you want to display. Take a look at the Composite Fields example. The two DisplayFields are “mins” and “hours”.