Field state valid -> invalid -> valid - doesnt remove qtip invalidClass

[jamie.nicholson]

Ext version tested:

• Ext 3.3 rev beta

Adapter used:

• ext
• yui
• jquery
• prototype

Browser versions tested against:

• Chrome
• FF3 (firebug 1.3.0.10 installed)

Operating System:

• Ubuntu Lucid

Description:

• When using a field qtip to display a custom message if that field has been invalid but is now valid the invalid class isn't cleared correctly and the custom message looks like an error with exclamation mark and red border line.

Test Case:

Apply this configuration to combo, works with other fields too,

      Ext.apply(this,{
         allowBlank:false,
         listeners:{
            scope:this,
            valid:function(c){
               //c.el.dom.qclass = ''; WORKAROUND clear the class manually
               c.el.set({qtip:c.getRawValue()});
            },
            invalid:function(c){
               c.el.set({qtip:''});
            },
         },
      });

Steps to reproduce the problem:

• ensure field is blank and is invalid state
• enter in some information making the field valid
• hover over field to produce qtip

The result that was expected:

• qtip would display in normal nice blue box

The result that occurs instead:

• qtip displays in validation error box with exclamation mark and red outline

Possible fix:

• Ext.form.MessageTargets = {
      'qtip' : {
  ...
          clear: function(field){
              field.el.removeClass(field.invalidClass);
              field.el.dom.qtip = '';
          }
      },
  
  changed to 
  Ext.form.MessageTargets = {
      'qtip' : {
  ...
          clear: function(field){
              field.el.removeClass(field.invalidClass);
              field.el.dom.qtip = '';
              field.el.dom.qClass ='';
          }
      },

[Condor]

I agree with you, but I also have to say that you shouldn't be mixing qtip tips and qtip error messages on the same element.