如何使用extjs 3中的textfield列创建编辑器网格面板

时间:2012-09-17 11:00:13

标签: jsp extjs

我在该网格面板中使用extjs创建了一个编辑器网格面板,默认情况下列应加载文本字段

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>',
                    },

                });

我希望评论字段应该加载文本框,有没有办法

提前致谢

1 个答案:

答案 0 :(得分:0)

不可能立即使用EditorGridPanel,因为AFAIK当时支持一个编辑器。可能最简单的解决方案是创建渲染器,将内容呈现为HTML input,然后将事件附加到该输入。您还可以使用applyTo配置属性为每个HTML输入创建组件。

使用applyTo的工作示例:http://jsfiddle.net/N2wYX/6/