Is there a way to include a subtle gray line between the label and field columns in an Ext JS form without manually drawing it?
Although I used a graphics program to add the line above, the actual form is generated using the following code:
var form_customer_contact = new Ext.FormPanel({
frame:true,
labelWidth: 140,
labelAlign: 'left',
bodyStyle:'padding:10px',
width: 300,
height: 600,
autoScroll: true,
itemCls: 'form_row',
defaultType: 'displayfield',
items: [{
fieldLabel: 'Customer Contact',
name: 'customerContact',
allowBlank:false,
value: 'Mr. Smith'
},
createCombo('Reason for Contact', 'reason', ['data correction', 'new contact', 'missing information']),
createCombo('Result', 'result', ['new data', 'old data', 'other data']),
createCombo('Communication', 'communication', ['telephone', 'fax', 'e-mail']),
createCombo('Related Order', 'relatedOrder', ['345234534','3453453452', '2234234234'])
, {
fieldLabel: 'Date',
xtype: 'datefield',
name: 'theDate',
format: 'd.m.Y',
width: 150,
id: 'theDate',
vtype: 'daterange'
}, {
fieldLabel: 'Time',
xtype: 'timefield',
name: 'theTime',
format: 'h:i:s',
width: 150,
id: 'theTime'
},{
fieldLabel: 'Notes',
name: 'relatedOrder',
value: 'These are the notes and they are very long and these are more notes and they are very long and these are more notes and they are very long and these are more notes and they are very long and these are more.'
}
]
});