2011-12-12 7 views
0

나는 다음과 같은 코드를 사용하여, ExtJS로하여 로그인 창을 건물입니다 렌더링 :의 ExtJS - 이상한 텍스트 필드 행동

Ext.define('DTL.view.windows.LoginWindow', { 
    extend : 'Ext.window.Window', 
    alias : 'widget.login', 
    id : 'loginWindow', 

    autoShow : true, 
    width : 400, 
    height : 180, 
    layout : 'border', 
    border : false, 
    modal : true, 
    closable : false, 
    resizable : false, 
    draggable : false, 

    initComponent : function() { 
     this.items = [{ 
       region : 'north', 
       height : 52, 
       bodyCls : 'app_header' 
      }, { 
       id : 'login_form', 
       region : 'center', 
       xtype : 'form', 
       bodyStyle : 'padding:10px; background: transparent;border-top: 0px none;', 
       labelWidth : 75, 
       defaultType : 'textfield', 
       items : [{ 
         fieldLabel : 'Username', 
         name : 'username', 
         id : 'usr', 
         allowBlank : false 
        }, { 
         fieldLabel : 'Password', 
         name : 'password', 
         inputType : 'password', 
         id : 'pwd', 
         allowBlank : false 
        } 
       ] 
      } 
     ]; 

     this.buttons = [{ 
       id : 'login_button', 
       text : 'Login', 
       disabled : true 
      } 
     ]; 

     this.callParent(arguments); 
    } 
}); 

지금 모든 암호 필드는 국경이 없다는 사실을 제외하고, 좋은 모습을.

나는 다양한 코드 수정을 시도했지만 아무것도 도움이되지 않습니다.

누구나 해결할 생각이 있습니까? 내가 ExtJS에 4.0.7을 사용하고

는 편집 :

나는 또 다른 흥미로운 발견을했다. 세 번째 텍스트 필드를 추가하면 버그가 그 텍스트 필드로 이동합니다.

는 분명히 항상 마지막 텍스트 필드에 영향을 미칩니다.

+0

모든 브라우저 (IE, Firefox 및 Chrome)에서 이와 유사합니까? –

+0

Firefox 및 IE8에서 방금 테스트했습니다. 같은 행동. – Demnogonis

+1

암호 필드를 재정의하는 추가 CSS 클래스가 추가 된 것처럼 보입니다. 어느 클래스가 적용되고 있는지 확인하기 위해 방화범을 피울 수 있습니까? – netemp

답변

1

이 문제는 창을 만드는 방법으로 인해 발생합니다. 이 엽차의 포럼 게시물 참조 :

Textfield Border Problem

즉 당신이 Ext.create ('DTL.view.windows.LoginWindow')를 사용할 필요가; xtype : 'login'보다