Here is my requirement:
I have a form, with 3 fields. If user changes the 3rd field to a specific value, I need to reset the 1st field and I want to give a feedback message adjacent to the 1st field with a custom message.
I understand there are different kind of Message Box is ExtJS like Prompt, Confirm, OK, Cancel etc. But I just want my message to appear and fade away in 2 seconds automatically. Can this be achieved using any ExtJS component?
I'd recommend using Ext.tip.QuickTip
for something like this.
Ext.create('Ext.tip.QuickTip', {
id: 'myquicktip',
hideDelay: 2000,
header: false
});
Ext.create('Ext.panel.Panel',{
title: 'Panel',
layout: 'hbox',
height: 200,
width: 600,
items: [{
xtype: 'textfield',
id: 'field1',
}, {
xtype: 'textfield',
id: 'field2',
}, {
xtype: 'textfield',
id: 'field3',
listeners: {
change: function(){
var field1 = Ext.getCmp('field1'),
tip = Ext.getCmp('myquicktip');
field1.setValue('');
tip.update('field1 has been cleared');
tip.showBy(field1)
}
}
}
],
renderTo: Ext.getBody()
});
Here is a fiddle link too: https://fiddle.sencha.com/#fiddle/9pd