Changing the color of the field when the condition

Question

For example, I have a text box with the input type "email". I set the default color for the field to pink. if the input is in the correct email format, I want the text color to be changed to white. how am i doing this

for example code:

xtype: 'textfield', labelWidth : 250, fieldStyle: 'background-color : #F5A9A9', vtype : 'email', fieldLabel: 'email address' 

Answer 1

In this case, we first need to check the value of the weather input - is this an email or not. For this, we use var fieldValidation = Ext.form.field.VTypes.email(val); If the fieldValidation value is true, then the input value is an email. Once we have checked the input value, we just change the background color. this.setFieldStyle("background-color : #FFFFFF")

Your code will look like this:

  { xtype: 'textfield', fieldStyle: 'background-color : #F5A9A9', vtype : 'email', fieldLabel: 'email address', validator : function(val){ var fieldValidation = Ext.form.field.VTypes.email(val); if(fieldValidation == true){ this.setFieldStyle("background-color : #FFFFFF"); } } } 

I created a violin for you. Please look. Working script .

I also attach a Vtype document to you to help you understand correctly. Doc