Edward Tanguay
Edward Tanguay

Reputation: 193302

How can I make a button be the value in a Ext.FormPanel field row?

I have a FormPanel that looks like this:

var simple_form_left = new Ext.FormPanel({
    frame:true,
    labelWidth: 90,
    labelAlign: 'right',
    title: 'Customer Information',
    bodyStyle:'padding:5px 5px 0',
    width: 290,
    height: 600,
    autoScroll: true,
    itemCls: 'form_row',
    defaults: {width: 160},
    defaultType: 'displayfield',
    items: [{
    ...

now I want to put this button in as a value of one of the rows:

var button = new Ext.Button({
    text: "Click this",
    handler: function() {
        alert('pressed');
    }
});

however when I add it as a value:

enter image description here

it just shows it as an object:

enter image description here

I can add it as a full field row like this:

}, {
    fieldLabel: 'Item 15',
    name: 'item15',
    value: 'test'
}, button, {
    fieldLabel: 'Item 17',
    name: 'item17',
    value: 'test'
}, {

but that is not what I want since it needs to have a label:

enter image description here

How can I add a button in replace of the text in the field row?

Addendum:

Thanks @Tommi, here's the code that I got to work with your solution:

enter image description here enter image description here

Upvotes: 0

Views: 53

Answers (1)

Tommi
Tommi

Reputation: 8608

Add the button object as an item, instead of adding a DisplayField and making the button the value of the DisplayField. And add a FieldLabel on that button.

Upvotes: 1

Related Questions