Thank you for reporting this bug. We will make it our priority to review this report.
  1. #1
    Ext JS Premium Member
    Join Date
    Feb 2008
    Posts
    258
    Vote Rating
    0
    PremiereGlobal is on a distinguished road

      0  

    Default [DUP] [3.0rc1] In text field the regex is not allow blank

    [DUP] [3.0rc1] In text field the regex is not allow blank


    In text field the regex is not allow blank. In ext 3.0 example if we give vtype:'email' then also it is not allow blank in case of you enter some text and erase it.

  2. #2
    Ext JS Premium Member
    Join Date
    Feb 2008
    Posts
    258
    Vote Rating
    0
    PremiereGlobal is on a distinguished road

      0  

    Default


    Hi,

    Looking at the ValidateValue function in ext-3.0-rc1\source\widgets\form\TextField.js I see that there is extra new check has been addded for vType and other conditions.
    Code:
            if(Ext.isFunction(this.validator)){
                var msg = this.validator(value);
                if(msg !== true){
                    this.markInvalid(msg);
                    return false;
                }
            }
            if(this.vtype){
                var vt = Ext.form.VTypes;
                if(!vt[this.vtype](value, this)){
                    this.markInvalid(this.vtypeText || vt[this.vtype +'Text']);
                    return false;
                }
            }
            if(this.regex && !this.regex.test(value)){
                this.markInvalid(this.regexText);
                return false;
            }
    This function return false if user try to clear the invalid value and does not fill any value.
    ideally if user has not put allowBlank:false on this field along with vtype then on clearing the invalid value it should not do any validation.

    Can this be treated as a bug to fix in full release?

  3. #3
    Ext JS Premium Member
    Join Date
    Feb 2008
    Posts
    258
    Vote Rating
    0
    PremiereGlobal is on a distinguished road

      0  

    Default


    This issue can be reproduced on xml-form.html in examples folder.
    Steps:1. enter some invalid value in email field e.g. 'test'. You get the error.
    2. then clear the invalid value. error should go (as per behavior in ext2.2)

  4. #4
    Sencha - Architect Dev Team aconran's Avatar
    Join Date
    Mar 2007
    Posts
    9,306
    Vote Rating
    125
    aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold

      0  

    Default


    Could you please explain in detail what the expected behavior is? We have made changes in allowBlank in 3.0 so that allowBlank does not immediately validate and void any potential vtype configuration.
    Aaron Conran
    @aconran
    Sencha Architect Development Team

  5. #5
    Ext User
    Join Date
    Dec 2007
    Posts
    13
    Vote Rating
    0
    worthy is on a distinguished road

      0  

    Default


    Code sample:
    Code:
    new Ext.form.TextField({
        vtype: 'email',
        allowBlank: true
    });
    And now in Ext 3.0 if field is empty and you try to validate you get invalid field and message: 'This field should be an e-mail address in the format "user@domain.com"'

    In Ext 2.x there was no message and field was valid.

    All of this is caused by different order of validation rules.
    Ext 3.0:
    Code:
    validateValue : function(value){
      // this.validator
      
      // this.vtype - email vtype retrun false on test and message appears
    
      // this.regex
    
      // this.allowBlank
    
      // this.minLength AND this.maxLength
    },
    Ext 2.x:
    Code:
    validateValue : function(value){
      // this.allowBlank
    
      // this.minLength AND this.maxLength
    
      // this.vtype
    
      // this.validator
    
      // this.regex
    },
    I don't know what motivated authors to change, but I think best order of validation will be:
    Code:
    validateValue : function(value){
      // this.allowBlank - if blank we don't have anything to validate
    
      // this.minLength AND this.maxLength - simplest tests
    
      // this.vtype - standard format test
    
      // this.regex - user format test
    
      // this.validator - it can have "business" logic validation so do it if format of value is correct
    },

  6. #6
    Sencha - Architect Dev Team aconran's Avatar
    Join Date
    Mar 2007
    Posts
    9,306
    Vote Rating
    125
    aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold

      0  

    Default


    Premiere -

    The motivation behind the change was because previously allowBlank would override all other validation once it validated.
    Aaron Conran
    @aconran
    Sencha Architect Development Team

  7. #7
    Ext User
    Join Date
    Jun 2008
    Location
    Dover, NH
    Posts
    10
    Vote Rating
    0
    iwtlf is on a distinguished road

      0  

    Default


    So it's not going to be "fixed"? It definitely seems logical to me that if allowBlank is not set to false (or at least when explicitly set to true) then a blank field should always validate no matter what.

  8. #8
    Ext User
    Join Date
    Dec 2007
    Posts
    13
    Vote Rating
    0
    worthy is on a distinguished road

      0  

    Default


    Bellow is my proposition. This is function with my favorite order and with duplication of code for custom validator.

    Code:
    Ext.override(Ext.form.TextField, {
        validateValue : function(value){
            if(value.length < 1 || value === this.emptyText){ // if it's blank
                 if(this.allowBlank){
    
                     // Check custom validation on empty value
                     // Don't use 'value' variable cause it may contains 'this.emptyText'
                     if(Ext.isFunction(this.validator)){
                        var msg = this.validator('');
                        if(msg !== true){
                            this.markInvalid(msg);
                            return false;
                        }
                     }
    
                     // Don't check other (length, vtype, regex) validators cause it dosen't have sense.
                     // On empty value they are always false.
    
                     this.clearInvalid();
                     return true;
                 }else{
                     this.markInvalid(this.blankText);
                     return false;
                 }
            }
    
            if(value.length < this.minLength){
                this.markInvalid(String.format(this.minLengthText, this.minLength));
                return false;
            }
            if(value.length > this.maxLength){
                this.markInvalid(String.format(this.maxLengthText, this.maxLength));
                return false;
            }
    
            if(this.vtype){
                var vt = Ext.form.VTypes;
                if(!vt[this.vtype](value, this)){
                    this.markInvalid(this.vtypeText || vt[this.vtype +'Text']);
                    return false;
                }
            }
    
            if(this.regex && !this.regex.test(value)){
                this.markInvalid(this.regexText);
                return false;
            }
    
            if(Ext.isFunction(this.validator)){
                var msg = this.validator(value);
                if(msg !== true){
                    this.markInvalid(msg);
                    return false;
                }
            }
    
            return true;
        }
    });

  9. #9
    Sencha - Ext JS Dev Team evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    16,945
    Vote Rating
    636
    evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute

      0  

    Default


    The problem is really in the naming. allowBlank implies blank is tolerated but not necessarily a valid value.

    allowBlank was behaving as blankValid.

    I think we need a way to shift the behaviour to have 2 properties

    1) Blank is allowed, but continue with validation
    2) Blank is a valid value
    Evan Trimboli
    Sencha Developer
    Twitter - @evantrimboli
    Don't be afraid of the source code!

  10. #10
    Ext User
    Join Date
    Oct 2007
    Posts
    8
    Vote Rating
    0
    Chimera is on a distinguished road

      0  

    Default


    Yes, there is definitely need for another property: required.

    I have a form where we can add new customers, it's a retail store so an e-mail address isn't required... Now in 3.0, I cannot tab through the form and not type an e-mail address without getting the validation-error. I cannot submit the form at all without figuring out a workaround, but an e-mail field that isn't required should be possible out of the box, in my opinion.