將自動對焦設置爲下一個按鈕

我在extjs中有嚮導，我在那裏放置下一個，後退和取消按鈕。根據要求，我需要自動將焦點設置在下一個按鈕上。怎麼做。將自動對焦設置爲下一個按鈕

buildButtons : function() { 
    return [ 
    { 
     text:'Back', 
     id:'backBtn', 
     hidden:true, 
     autoHeight:true, 
     action: 'Back' 
    }, 
    { 
     text:'Next', 
     id:'nextBtn', 
     autoHeight:true, 
     hidden:false, 
     action: 'Next' 
    }, 
    { 
     text:'Finish', 
     id:'finishBtn', 
     autoHeight:true, 
     hidden:false, // Comments below line if you want finished button on each panel. 
     //hidden:true, 
     action: 'Finish' 
    }, 
    { 
     text:'Cancel', 
     id:'cancelBtn', 
     autoHeight:true, 
     hidden:false, 
     action: 'Cancel' 
    } 
    ]; 

}

來源

2012-09-05 Dhananjay

假設你正在談論的最新版本（4.1.1）

獲取按鈕參考，並調用focus

你應該要麼按鈕本身或的一個AfterRender事件做到這一點保存按鈕的組件。可以直接在的API代碼盒一個

Ext.create('Ext.Container', { 
    renderTo: Ext.getBody(), 
    defaults: { 
     xtype: 'button' 
    }, 
    items : [ 
     { 
      text: 'Next', 
      action: 'next' 
     }, 
     { 
      text: 'Prev', 
      action: 'prev' 
     }, 
     { 
      text: 'Cancel', 
      action: 'cancel' 
     } 
    ], 
    listeners: { 
     afterrender: function(b) { 
      b.down('button[action=next]').focus(false, 100); 
     } 
    } 
});

編輯執行

例回答的評論：

根據給定的信息，我建議你使用配置屬性buttons放置您的按鈕。在你的情況下，我會建議你使用dockedItems數組而不是便利的按鈕數組。請嘗試以下操作：

dockedItems: [{ xtype: 'toolbar', dock: 'bottom', ui: 'footer', defaults: {minWidth: minButtonWidth}, items: [ { text:'Back', id:'backBtn', hidden:true, autoHeight:true, action: 'Back' }, { text:'Next', id:'nextBtn', autoHeight:true, hidden:false, action: 'Next' }, { text:'Finish', id:'finishBtn', autoHeight:true, hidden:false, // Comments below line if you want finished button on each panel. //hidden:true, action: 'Finish' }, { text:'Cancel', id:'cancelBtn', autoHeight:true, hidden:false, action: 'Cancel' } ], listeners: { afterrender: function(b) { b.down('button[action=Next]').focus(false, 100); } } }]

來源

2012-09-05 09:44:16 sra

請檢查我的代碼，並幫我在這。 – Dhananjay

@Dhananjay文章編輯 – sra

呀如@sra說，使用這樣的：

Ext.getCmp('IdOfNextButton').focus();

或者從您的形式使用更好的向上/向下的方法之一通過一個特定的類找到它，而比依靠一個Id。

來源

2012-09-05 09:50:30 dougajmcdonald

如果你可以使用它，一個更好的方法是使用Ext.window.Window的defaultFocus配置。從docs：

defaultFocus：字符串/數字/ Ext.Component

指定組件時，此窗口集中到接收焦點。

這可能是以下之一：

頁腳按鈕的索引。

後代組件的id或Ext.AbstractComponent.itemId。

組件。

可用，因爲：4.0.0

來源

2016-01-20 14:19:22 Mark

將自動對焦設置爲下一個按鈕

回答

相關問題