验证文本字段

Posted 2023-02-25

【中文标题】验证文本字段

【英文标题】：Validating a textfield

【发布时间】：2012-05-10 15:52:39

【问题描述】：

根据以下代码，名称文本字段不能留空。当用户单击文本字段并决定将其留空时，将弹出错误。

但是如果用户直接点击按钮而不点击文本字段，它会被提交并且不会显示错误消息。所以我想做的是在用户点击提交按钮时提醒用户，如果他/她在name 文本字段上留空。

   
  xtype:'textfield',
  name:'name',
  label:'name',
  required: true,
  listeners: 
      blur: function(thisTxt, eventObj) 
             var val= thisTxt.getValue();
             if ( val.length==0) 
                     // display alert
              
      
  
]
,

  xtype:'button',
  id:'new-note-btn',
  text:'Send',
  ui:'confirm',
  padding:5
 

【参考方案1】：

将一些id 属性赋予您的textfield 并按照以下代码进行操作..

xtype:'textfield',
name:'name',
id: 'textId',
.....
......

和

  xtype:'button',
  id:'new-note-btn',
  text:'Send',
  ui:'confirm',
  padding:5,
  listeners : 
       tap : function() 
           if(Ext.getCmp('textId').getValue()=="") 
                // display the alert ..
           
       
  

注意：如果此 textfield 恰好在您的 formpanel 中，那么您将获得 formpanel 值，然后尝试使用 name 属性访问此 textfield 值如下图..

// Assuming formpanel id = 'formPanelId' ...

listeners : 
    tap : function() 
         var values = Ext.getCmp('formPanelId').getValues();
         var nameValue = values.name;
         if(nameValue == "") 
               // display the alert ..