ExtJS - 패널의 헤더에 툴팁 추가

Question

Ext.panel.Panel 컨트롤을 사용하는 응용 프로그램을 개발 중입니다. 이 패널에는 본문과 머리글이 있습니다. 내가 뭘해야 내가 이것으로 시도 된 패널의 헤더 (헤더 onlye없는 몸)

에 툴팁 (텍스트 만)를 추가하는 것입니다

listeners: { 
    render: function() { 
     this.getEl().dom.title = 'my custom tool tip'; 
    } 
}, 

을하지만, 그것은 단지 작동 본문이 아니라 헤더. 그것을하는 방법을 알고 있습니까? 나는 내선을 사용하고 4.2.1

편집 :

이 내가 툴팁을

Ext.define('XXX.XXX.XXX.MyCustomPanel', { 
extend: 'Ext.panel.Panel', 

setMyTitle: function() { 
    var ds = this.getDataSource(); 

    try { 
     this.setTitle(ds.getCustomTitle()); 
     // Add tooltip where tooltip = ds.getCustomTitle(); 

    } catch (e) { 

    } 
}, 

감사합니다, 안젤로을 보여주기 위해 노력하고있어 어떻게

당신은 헤더의의 속성을 구성 할 수 있습니다

Answer 1

패널의 header에 autoEl 구성이있는 기본 HTML 요소 config :

header: { 
    autoEl: { 
     title: 'This is a tooltip' 
    } 
} 

당신이 QuickTips을 사용하려는 경우

또는 :

header: { 
    autoEl: { 
     'data-qtip': 'This is a tooltip' 
    } 
} 

또한이 fiddle를 참조하십시오.

편집 : 패널이 이미 렌더링 된 후 툴팁 적용은 (코드로 조정) :

setMyTitle: function() { 
    var ds = this.getDataSource(), 
     title = ds.getCustomTitle(); 

    try { 
     this.setTitle(title); 
     // again, obviously just one out of the two attributes 
     this.getHeader().getEl().set({ 
      'title': title, 
      'data-qtip': title 
     }); 
    } catch (e) { 

    } 
} 

Answer 2

당신은 Ext.tip.ToolTip를 작성하고 헤더에 할당해야합니다

var tip = Ext.create('Ext.tip.ToolTip', { 
    target: 'clearButton', 
    html: 'Press this button to clear the form' 
}); 

http://docs.sencha.com/extjs/4.1.3/#!/api/Ext.tip.ToolTip