How to create the editor grid panel with textfield column in extjs 3

Question

I have created one editor grid panel using extjs in that grid panel by default columns should load with the textfield

var Grid= new Ext.grid.EditorGridPanel({
    store:checkpoint,
    renderTo:'testgrid',
    autoHeight:true, 
    border:false,
    clicksToEdit: 1,
    columns: [ {header:'Check Points',
                 menuDisabled: true,
             dataIndex: 'checkpoints',
             valueField:'Id',
             width:300,
            },
             {
                 menuDisabled: true,
                 header:'Report',
                 dataIndex: 'developerreport',
                 renderer:  function (v,p) {
                     p.attr += ' ext:qtip=" click to edit"';
                     return v; 
                   } ,

                 editor:  new Ext.form.ComboBox({

                    hideTrigger: true, 
                    name: 'comment',
                    id:'comment',
                    mode: 'local',
                    store: names,
                    displayField: 'role',
                    triggerAction: 'all',
                    emptyText:'Select Role',
                    allowBlank:     false,
                    editable:       false,
                    forceSelection: true}),},
                   {header:'Comment',
                     menuDisabled: true,
                     dataIndex: 'developercomment',
                     renderer:  function (v,p) {
                        p.attr += ' ext:qtip=" click to add"';
                         return v;
                      } ,

                     editor: new Ext.form.TextField({
                        }),}],
              viewConfig: {
                    deferEmptyText: false,
                    forceFit: true,
                    emptyText: '<p style="font-size: 13px;color:red;">Please fill the above details</p>',
                    },

                });

I want comment field should load with textbox, is there any ways to do

thanks in advance

Do you want to have a textfield right away, without entering edit mode? — Krzysztof

Krzysztof Krzysztof · Accepted Answer · 2012-09-17T12:13:49

It's not possible to do it with EditorGridPanel straight away, because AFAIK it supports one editor at the time. Probably the easiest solution is to create renderer which renders content as HTML input and then attach event's to that input. You can also create component for each HTML input using applyTo config property.

Working sample that uses applyTo: http://jsfiddle.net/N2wYX/6/

How to create the editor grid panel with textfield column in extjs 3

1 Answers