ExtJS : 행 아래에 항상 행 편집 플러그인 버튼을 만드는 방법

Question

안녕하세요. extJS 6.2 classic을 사용하고 있습니다. 행 편집 플러그인을 사용하여 그리드를 얻었습니다. 행 편집을 시작할 때 행 편집으로 생성 된 버튼이 행 위에 있습니다. my screenshot 나는 그리드가 버튼을 굵게 표시 할만큼 높지는 않지만 그리드 높이를 설정하면 문제를 해결할 수 없다고 생각했다. 어떤 도움을 주시면 감사하겠습니다

xtype:'grid', 
 
height:500, 
 
... 
 
plugins: [ 
 
    { 
 
     ptype: 'rowediting', 
 
     errorSummary:false, 
 
     removeUnmodified:false, 
 
     triggerEvent:'non' 
 
    } 
 
],

: 은 아래에있는 내 코드입니다.

Answer 1

ExtJS의 기존 버그이며 ExtJS Row Editing 예에서도 찾을 수 있습니다. 해결 방법은 한 가지이지만 해결 방법이 아닙니다.

행 편집을위한 버튼을 생성하는 데 사용되는 Ext.grid.RowEditorButtons 클래스의 ExtJS를 무시할 수 있습니다.

Ext.override(Ext.grid.RowEditorButtons, { 
    constructor: function(config) { 

     var me = this, 
      rowEditor = config.rowEditor, 
      cssPrefix = Ext.baseCSSPrefix, 
      plugin = rowEditor.editingPlugin; 

     config = Ext.apply({ 
      baseCls: cssPrefix + 'grid-row-editor-buttons', 
      defaults: { 
       xtype: 'button', 
       ui: rowEditor.buttonUI, 
       scope: plugin, 
       flex: 1, 
       minWidth: Ext.panel.Panel.prototype.minButtonWidth, 
       height: 18, 
       style: 'padding: 0' 
      }, 
      items: [{ 
       cls: cssPrefix + 'row-editor-update-button', 
       itemId: 'update', 
       handler: plugin.completeEdit, 
       text: rowEditor.saveBtnText, 
       disabled: rowEditor.updateButtonDisabled, 
       listeners: { 
        element: 'el', 
        keydown: me.onUpdateKeyDown, 
        scope: me 
       } 
      }, { 
       cls: cssPrefix + 'row-editor-cancel-button', 
       itemId: 'cancel', 
       handler: plugin.cancelEdit, 
       text: rowEditor.cancelBtnText, 
       listeners: { 
        element: 'el', 
        keydown: me.onCancelKeyDown, 
        scope: me 
       } 
      }] 
     }, config); 

     me.callParent([config]); 

     me.addClsWithUI(me.position); 

    } 
}); 

link을 참조하십시오.