2012-07-11 4 views
0

현재 Phonegap 1.6.0과 Sencha Touch 1.1을 사용하여 웹 기반 모바일 응용 프로그램을 만들고 있습니다. 이 앱은 사용자가 클릭 할 수있는 여러 패널로 구성됩니다. 일부 패널에는 텍스트 필드 또는 텍스트 영역이 있습니다. 패널에 입장 할 때, 우리는 이들이 자동으로 집중되기를 원합니다. 텍스트 필드에서는 작동하지만 텍스트 영역에서는 작동하지 않는 것 같습니다.Sencha Touch 1.1 : 표시 방법 후 TextArea에 초점 맞추기

내가 먼저 패널을 열 때마다
xtype: 'textareafield', 
cls: 'jasbackblock', 
id: 'addreactiontextarea', 
height: '100%', 
grow: true, 
listeners: { 
    afterrender: function(cmp) { 
    console.log('Component rendered.'); 
    cmp.fieldEl.dom.focus(); 
} 

, 자동으로 초점을 맞추고, 좋은 :

나는 다음과 같은 구성 요소와 패널이있다. 그러나 패널을 빠져 나와 패널로 돌아 가면 이벤트로이를 수행하는 좋은 방법을 생각할 수 없습니다. 나는 이전 패널에서 쇼 리스너를 시도 :

Uncaught TypeError: Cannot read property 'fieldEl' of null 

내가 쇼 이벤트 기간 동안 요소에 액세스 할 수없는 것 같습니다 :

listeners: { 
    show: function(cmp) { 
     Ext.get('addreactiontextarea').fieldEl.dom.focus(); 
    } 
} 

이 나에게 다음과 같은 오류를 제공합니다. 패널을로드 할 때마다 어떤 이벤트가 발생하여 텍스트 영역에 액세스 할 수 있습니까? 사전에

function switchScreen(from, to, newArgs) { 
    /* Save screen information. */ 
    if (from != -1) 
     historyStack.push([from, screenArgs]); 

    if (currentPage > 2) { 
     if (to != 3) 
      main.getComponent(3).hide(); 
     app.getComponent(currentPage - 3).hide(); 
    } 
    else 
     main.getComponent(currentPage).hide(); 

    screenArgs = newArgs; 

    if (to > 2) { 
     main.setActiveItem(3); 
     app.setActiveItem(to - 3); 

     /* setActiveItem does not fire a screen's show event if it has been 
     * shown before. Since we want the code in the screen's show listener to 
     * be executed every time we switch to the screen, we call show manually 
     * just to fire the event. */ 
     main.getComponent(3).show(); 
     app.getComponent(to - 3).show(); 
    } 
    else { 
     main.setActiveItem(to); 
     main.getComponent(to).show(); 
    } 

    if (to == 0 || to == 1) 
     adMode = to; 
    else 
     adMode = -1; 

    currentPage = to; 
} 

감사합니다 : 그것은 어떤 도움이 경우

, 이것은 우리가 한 패널에서 다른 전환을 위해 전화하는 방법입니다.

답변

0

나는이 문제를 해결했다. 문제는 DOM 요소가 어떻게 작동하는지 잘 알지 못했다는 것입니다.

Ext.get ('id')은 id가 'id'인 Javascript 객체의 DOM 요소를 반환합니다. 객체 자체를 반환하지 않습니다. Ext.getCmp ('id')는 id가 'id'인 Javascript 객체를 반환합니다. 따라서 Ext.getCmp ('id'). fieldEl은 Ext.get ('id')과 동일한 객체를 반환합니다.

Sencha Touch 1.1의 버그로 인해 우리는 Sencha 포커스 기능보다는 DOM 포커스 기능을 사용하기로 결정했습니다. Ext.getCmp ('id'). fieldEl.dom.focus() 또는 Ext.get ('id'). dom.focus()를 사용하여이 함수에 액세스 할 수 있습니다. 당신이 내 질문에서 볼 수 있듯이, 나는 이것을 혼합했다. DOM 요소에 대한 경험이 부족하기 때문에이 방법으로 Object 함수를 사용하려고하면 훨씬 더 혼란스러워졌습니다. (Ext.get ('id'). reset()은 단순히 비논리적입니다.)

질문이 있으시면 언제든지 알려 주시기 바랍니다.

+0

이런 식으로 텍스트 필드를 가지고 있는데, 해당 텍스트 필드를 집중하려고했습니다. 시도했습니다. Ext.getCmp ("searchcontact"). focus(); Ext.getCmp ('searchcontact') .fieldEl.dom.focus() 둘 다 작동하지 않습니다. { 위해 xtype : '텍스트 필드', 이름 : 'searchcontact', 해당 itemId : 'searchcontact', 자리 표시 자 : '검색 제목', ID : 'searchcontact', 이름 : 'searchcontact', CLS ' searchcontactcss ' } – Dibish

관련 문제