텍스트 필드가 비어있을 때 오류 메시지가 표시되지 않음

Question

textfield 및 버튼이 있는데 textfield이 비어 있거나 비어있는 경우 사용자가 Send 버튼을 클릭하면 오류 메시지가 나타납니다. 내 코드는 다음과 같습니다.

내 코드에 따르면 textfield 값이 비어 있더라도 Send 버튼을 클릭하여 제출할 수 있습니다. 그러나 텍스트 필드를 클릭하고 비워두면 텍스트 필드의 테두리가 빨간색으로 변하고 hover이 textfield 이상이면 오류 메시지가 나타납니다.

내가 원하는 것은 사용자가 보내기 버튼을 클릭 할 때 오류 메시지 (텍스트 필드가 비어있는 경우)가 튀어 나오는 것입니다. 당신이 팝업 메시지를 제시해야하는 경우

    { 
         xtype: 'button', 
         text: 'Send', 
         action: 'send1' 

        }, 

        xtype: 'textfield',        
         name: 'name', 
         fieldLabel: 'Name', 
         allowBlank: false, 
         blankText: 'Name left blank' 
        }, 

Answer 1

당신은 버튼을 클릭 핸들러에서 수동으로이 작업을 수행해야합니다. ExtJs는 기본 제공 기능을 제공하지 않습니다. 모든 요소에 대한 모든 검증을 통과 할 때까지 그러나 당신은 버튼이 비활성화됩니다 귀하의 버튼 정의와는 ExtJS로

formBind: true 

를 추가 할 수 있습니다. 텍스트 필드의 ID를함으로써

Answer 2

    { 
        xtype: 'button', 
        text: 'Send', 
        action: 'send1' 

       }, 
       { 
        xtype: 'textfield', 
        id:'nameField', 
        name: 'name', 
        fieldLabel: 'Name', 
        allowBlank: false, 
        blankText: 'Name left blank' 
       } 

, U 버튼

   if(Ext.getCmp('nameField').getValue().length== 0) 
        Ext.Msg.alert('FormSubmissionError','TextField should not be empty'); 
       else 
        Submit the form.