1. #1
    Sencha User
    Join Date
    Nov 2010
    Posts
    17
    Vote Rating
    0
    sim4life is on a distinguished road

      0  

    Default Conditional fields validations

    Conditional fields validations


    Hi I'm looking for a similar solution as described in the following thread for ExtJS
    http://www.sencha.com/forum/showthre...ght=validation

    Basically, I have 2 fields, a selectfield and a datefield. Both are optional but if the user picks some value for selectfield then he must also pick a date in the datefield.
    My partially written code is

    Code:
    Ext.regModel('Todo', { 
                    fields: [
                        {name: 'id', type: 'int'},
                        {name: 'title', type: 'string'},
                        {name: 'due_at', type: 'date'},
                        {name: 'remind_before', type: 'string'},
                        {name: 'completed_at', type: 'string'},
                        {name: 'todo_id', type: 'int'},
                        {name: 'cl_state', type: 'string'},
                        {name: 'action', type: 'string'}
                    ],
                    validations: [
                        {type: 'presence', name: 'title', message: "Title is required"},
                        {type: 'presenceDueDate', name: 'remind_before'}
                    ]
                });
    Code:
    Ext.apply(Ext.data.validations,{
                    presenceDueDateMessage: 'Due Date is missing',
                    presenceDueDate: function(config, value) {
                        if(value == "") {
                            return true;
                        } else {
                            console.dir(this);
                            // if()//validate presence of due date
                                return false;
                        }
                    }
                });
    I think I need to write the custom validator function like presenceDueDate. In the second last line of code // if presence of due date field is validated then I return true otherwise, u guessed it, false

    Secondly, the validations option of a model takes an array with its items' options as name, type, message, list etc... Exactly where in the documentation/source code are all these options listed [In case I don't have to write a custom validator?]

    Anyone with any help plz!

  2. #2
    Sencha User krause's Avatar
    Join Date
    Jun 2008
    Posts
    53
    Vote Rating
    0
    krause is on a distinguished road

      0  

    Lightbulb


    I think you are in the right path, the only problem is that your custom validation function (i.e. presenceDueDate) only receives config and value as arguments. You need access to the rest of the record/model in order to peek into other fields. For this you might have to override the validate method in Ext.data.Model in order to pass the model, for example:

    Code:
    Ext.override(Ext.data.Model, {
    	    /**
    	     * Validates the current data against all of its configured {@link #validations} and returns an 
    	     * {@link Ext.data.Errors Errors} object
    	     * @return {Ext.data.Errors} The errors object
    	     */
    	    validate: function() {
    	        var errors      = new Ext.data.Errors(),
    	            validations = this.validations,
    	            validators  = Ext.data.validations,
    	            length, validation, field, valid, type, i;
    
    	        if (validations) {
    	            length = validations.length;
    	            
    	            for (i = 0; i < length; i++) {
    	                validation = validations[i];
    	                field = validation.field || validation.name;
    	                type  = validation.type;
    	                valid = validators[type](validation, this.get(field), this);
    	                
    	                if (!valid) {
    	                    errors.add({
    	                        field  : field,
    	                        message: validation.message || validators[type + 'Message']
    	                    });
    	                }
    	            }
    	        }
    	        
    	        return errors;
    	    }
    	});
    and your custom validator now would recieve a third argument which is the model instance you are validating, so you could take a look at other fields, for example model.get('due_at') and do whatever comparison you need.

    Hope this helps.

    [Applies to Sencha Touch 1.1.0]
    Last edited by krause; 16 Jun 2011 at 8:37 AM. Reason: Specified version of Sencha Touch 1.1.0

  3. #3
    Sencha User krause's Avatar
    Join Date
    Jun 2008
    Posts
    53
    Vote Rating
    0
    krause is on a distinguished road

      0  

    Default


    Additionally, since Ext.data.validations is a singleton you might want to consider a generic "custom" validator type which will call the specified "validator" method when required like this:

    Code:
    Ext.apply(Ext.data.validations , {
    		custom : function(config, value, model) {
    			return config.validator.apply(this, arguments);
    		}
    	});

    Code:
    myModel = Ext.regModel('myModel', {
    	fields : [ {
    		name : 'tel',
    		type : 'string'
    	}, {
    		name : 'email',
    		type : 'string'
    	}],
    
    	validations : [ {
    		field : 'tel',
    		type : 'custom',
    		message : 'Either phone or mail are required',
    		validator : function(config, value, model) {
    			if ( Ext.isEmpty(value) && Ext.isEmpty(model.get('email')) ) {
    				return false;
    			}
    			return true;
    		}
    	}]
    });
    This way, if you have several conditional validations in your app, you don't pollute the Ext.data.validations singleton. Notice that this will still need the override to the validate method of Ext.data.Model described in the previous post in order to get access to the rest of the model.

    Just an idea.
    Last edited by krause; 16 Jun 2011 at 10:10 AM. Reason: code was not properly terminated

  4. #4
    Sencha User
    Join Date
    Nov 2010
    Posts
    23
    Vote Rating
    0
    bwg is on a distinguished road

      0  

    Thumbs up


    This method works very well. Thanks!

Similar Threads

  1. Conditional renderer on form fields
    By scottmartin in forum Ext 3.x: Help & Discussion
    Replies: 2
    Last Post: 12 Dec 2010, 9:04 AM
  2. validations are sliding
    By shaik.yasinbasha in forum Ext 3.x: Help & Discussion
    Replies: 0
    Last Post: 29 Oct 2009, 6:35 AM
  3. EditorGrid New Row validations
    By bhaskar1605 in forum Ext 2.x: Help & Discussion
    Replies: 3
    Last Post: 21 Oct 2008, 8:36 AM
  4. Validations
    By psambhus in forum Ext 2.x: Help & Discussion
    Replies: 6
    Last Post: 16 Apr 2008, 2:13 AM
  5. Date Validations?
    By Icon_Plus in forum Ext 2.x: Help & Discussion
    Replies: 4
    Last Post: 14 Apr 2008, 1:49 AM

Thread Participants: 2

Tags for this Thread