Forms are set up by default with a very bland error display which shows any type of error with a squiggly red line under the form field. This error display closely mimics the errors shown in programs like Microsoft Word when you spell a word incorrectly. We do have other options for displaying our error messages, but we will need to tell Ext JS to use them instead of the default.
One built-in option is to display the error message in a balloon using an Ext JS object called QuickTips. This utilizes the standard squiggly line, but also adds a balloon message that pops up when we mouse over the field, displaying error text within.
 |
We just need to add one line of code before our form is created that will initialize the QuickTips object. Once the QuickTips object is initialized, the form fields will automatically use it. This is just one simple statement at the beginning of the script:
Ext.QuickTips.init();
This is all that needs to happen for our form fields to start...