1. #1
    Ext JS Premium Member
    Join Date
    Nov 2008
    Posts
    289
    Vote Rating
    3
    wki01 is on a distinguished road

      0  

    Default extend field validateValue

    extend field validateValue


    This piece of code works fine in ext30, but the translation ext40 not working properly.
    It does not work (in ext40) the validation of the field.

    It has changed the way it should be handled validateValue?

    Somebody can put here the proper way to handle this situation?
    thanks

    Ext 30
    Code:
    Wki.TextField = Ext.extend(Ext.form.TextField, {
        initComponent:function() {
             Ext.apply(this, {
            }); 
            Wki.TextField.superclass.initComponent.call(this); 
        }, 
        validateValue : function(value){
            if (this.allowBlank == false && value.trim() == "") {
                this.markInvalid();
                return false;
            }
            return (Wki.TextField.superclass.validateValue.call(this, value));
        }
    });
    Ext40
    Code:
    Ext.define('Wki.TextField', {
        extend: 'Ext.form.Text',
        alias: 'widget.wkitextfield',    
        constructor: function(config) {    
            config = config || {};    
            Ext.apply(this, { 
            });
            Wki.TextField.superclass.constructor.apply(this, arguments);
        },
        validateValue : function(value){
            if (this.allowBlank == false && value.trim() == "") {
                this.markInvalid();
                return false;
            }
            return (Wki.TextField.superclass.validateValue.call(this, value));
        }   
    });

  2. #2
    Sencha User
    Join Date
    Dec 2009
    Location
    Enschede, The Netherlands
    Posts
    327
    Vote Rating
    13
    flanders will become famous soon enough

      0  

    Default


    The documentation discourages overriding validateValue (http://dev.sencha.com/deploy/ext-4.0...#validateValue)

    If possible I would stick to using the configuration properties 'allowBlank', 'regex' and 'validator'

  3. #3
    Ext JS Premium Member
    Join Date
    Nov 2008
    Posts
    289
    Vote Rating
    3
    wki01 is on a distinguished road

      0  

    Default


    I tried to use validated, but that does not work.
    The documentation is specified as allowed.

    thanks

    Code:
    Ext.define('Test.TextFieldRemoteVal', {
        extend: 'Ext.form.Text',
        alias: 'widget.testtextfieldremoteval',
       
        urlRemoteVal: null,
        timeout: 30,   
        method: 'POST',
        badServerRespText: 'Risposta non valida dal server',
        badComText: 'Attendere la risposta del server',
         
        getParams: function() {   
            var tfp = ("query")+'='+this.getRawValue();
            var p = (this.paramsRemoteVal?this.paramsRemoteVal:'');
            if(p){
                if(typeof p == "object")
                    tfp += '&' + Ext.urlEncode(p);
                else if(typeof p == 'string' && p.length)
                    tfp += '&' + p;
                else if (typeof p === 'function')
                    tfp += '&' + p.call(this);               
            }            
            return tfp;
        },  
        validate: function() {                    
            var v = this.getValue();   
           
            // NO WORK !!!
            if (Test.TextFieldRemoteVal.superclass.validate.call(this) == false) {
                return false;
            }
           
            if (this.allowBlank && Ext.String.trim(v) == "") {           
                return true;                     
            }
       
            this.isValid  = false;
            this.markInvalid(this.badComText);   
           
            if( this.transaction ) {
                this.abort();
            }
           
            var params = this.getParams();
            this.transaction = Ext.Ajax.request({
                method: this.method,
                url: this.urlRemoteVal,
                success: function(response) {
                    this.transaction = null;   
                    var result = this.processResponse(response);               
                    if(result) {
                        if(result.success == false) {
                            this.isValid  = false
                            this.markInvalid(result.reason);                               
                        } else {
                            this.isValid  = true   
                            this.clearInvalid();
                        }
                    } else {
                        this.isValid  = false           
                        this.markInvalid(this.badServerRespText);
                    }
                },
                failure: function(response) {
                    this.transaction = null;
                    this.isValid  = false           
                    this.markInvalid(this.badServerRespText);
                },
                scope: this,
                timeout: (this.timeout*1000),
                params: params
            })
        },
        abort : function(){
            if(this.transaction){
                Ext.lib.Ajax.abort(this.transaction);
            }
        },
        processResponse: function(response) {
            console.log(response.responseText)
            return (!response.responseText ? false : Ext.decode(response.responseText));
        }
    });

  4. #4
    Sencha User
    Join Date
    Dec 2009
    Location
    Enschede, The Netherlands
    Posts
    327
    Vote Rating
    13
    flanders will become famous soon enough

      0  

    Default


    The default validation, (possibly) generating errors, is done by getErrors(). The default getErrors() implementation uses a number of ways to validate the value of a field. The description is currently not visible in the documentation, but can be found in the source (http://dev.sencha.com/deploy/ext-4.0...Text-getErrors)

    In your case you should only have to provide this config or something alike (untested):

    Code:
    xt.define('Test.TextFieldRemoteVal', {
    	...,
    	allowBlank: false,
    	validator: function(value) {
    		if (Ext.String.trim(v) == "") {
    			return true;
    		} else {
    			return "This field has to contain more then just whitespace";
    		}
    	},
    	// Since there are more ways the field can become invalid (through allowBlank
    	// or an regexp) i would listen for the validitychange event and work from there
    	listeners: {
    		scope: this,
    		validitychange: function(field, event) {
    			if (field.isValid() == false && this.transaction) {
    				this.transaction.abort();
    			}
    		}
    	}
    });

Similar Threads

  1. Trying to extend field
    By ludo in forum Ext 3.x: Help & Discussion
    Replies: 0
    Last Post: 21 Jan 2011, 7:23 AM
  2. Replies: 3
    Last Post: 19 Nov 2009, 6:18 AM
  3. How to: extend form field to get 2 textbox
    By SchattenMann in forum Ext 2.x: Help & Discussion
    Replies: 7
    Last Post: 22 Jul 2009, 10:00 AM
  4. How to extend field capabilities?
    By throttle in forum Ext GWT: Help & Discussion (1.x)
    Replies: 0
    Last Post: 16 Jan 2009, 3:31 AM
  5. Form.isValid() when Field.validateValue() is asynchronous
    By Animal in forum Community Discussion
    Replies: 5
    Last Post: 22 Jun 2007, 10:53 AM

Thread Participants: 1