Page 2 of 5 FirstFirst 1234 ... LastLast
Results 11 to 20 of 45

Thread: More VTypes!

  1. #11

    Default Usage Question...

    Where's the magic?

    I was trying to amend the "Fieldsets, labels right and complex fields" (Form 3) in the Synamic Forms Examples... I added the following to the dynamic.js file:


    PHP Code:
        /*
         * ================  Form 3  =======================
         */
       
    Ext.form.VTypes["phone"] = /^(\d{3}[-]?){1,2}(\d{4})$/;
       
    Ext.form.VTypes["phoneMask"] = /[\d-]/;
       
    Ext.form.VTypes["phoneText"] = 'Not a valid phone number.  Must be in the format 123-4567 or 123-456-7890 (dashes optional)';

    ...

            new 
    Ext.form.TextField({
                
    fieldLabel'Phone',
                
    name'phone',
                
    vtype:'phone',
                
    width:190
            
    }), 

    Yet when I navigate to the Phone field, key in some data then exit, I get the following Error:

    Line: 182
    Char: 2896
    Error: function expected
    Code: 0
    URL: http://localhost/ext/examples/form/dynamic.html

    How do I use the new mask? Thanks in Advance!

  2. #12
    Ext JS Premium Member
    Join Date
    Mar 2007
    Location
    Virginia, USA
    Posts
    504

    Default

    Ext.form.Vtypes["phone"] must be a function
    Code:
    Ext.form.VTypes["phoneVal"] = /^(d{3}[-]?){1,2}(d{4})$/; Ext.form.VTypes["phoneMask"] = /[d-]/; Ext.form.VTypes["phoneText"] = 'Not a valid phone number. Must be in the format 123-4567 or 123-456-7890 (dashes optional)'; Ext.form.VTypes["phone"]=function(v){ return Ext.form.VTypes["phoneVal"].test(v); }


  3. #13

    Default Thanks...

    Thanks, I thought something was missing...

    Also, I came across the following way to do the same thing:

    PHP Code:
    Ext.applyExt.form.VTypes
                
    , { 'phone': function()
                   {  var 
    re = /^(\d{3}[-]?){1,2}(\d{4})$/;
                      return function(
    v) { return re.test(v); }
                   }()
                , 
    'phoneText' 'The format is wrong, ie: 123-456-7890 (dashes optional)'
                
    }); 

    That gets me one step closer....

    Now, I'd really like to create an Input Mask so that the User keys in 1234567890 and then the data is reformatted to display (123) 456-7890...

    Anyone know how to do this?

    Thanks in Advance!!

  4. #14
    Sencha User
    Join Date
    Mar 2007
    Posts
    218

    Default vtype

    stress test.Sometimes Ie cannot figure out the validation process even if you return a function.On Firefox without return it can figure out but on IE it fail.Even panel color which somebody put attachment before also got into problem

  5. #15
    Ext JS Premium Member
    Join Date
    Mar 2007
    Location
    Virginia, USA
    Posts
    504

    Default

    Rebel: that is nice and clean I like it. If you figure out how to display formatted text like phone numbers (123) 456-7890 please share.

    At this point there is no mechanism to look at the entire string.
    MaskRe only looks at the single character typed.
    I think you'd need to validate the entire string in the text box in addition to the new character. And you have to know where that character is going to be inserted in the string (cursor location). I started a thread somewhere on this going down a similar path. Search under my id.

  6. #16
    Sencha User hcervantes's Avatar
    Join Date
    Mar 2007
    Location
    Centerville, OH
    Posts
    80

    Default Is there a VType for date?

    I know I can use a datefield, but I need a textfield to be dynamic because it might either be a date entry field, number entry field or alpha entry field. How can I apply a VType for dates?

    Thanks
    -Hector Cervantes
    GIS Pro

  7. #17
    Sencha User hcervantes's Avatar
    Join Date
    Mar 2007
    Location
    Centerville, OH
    Posts
    80

    Cool VType for Date

    This works pretty slick. It handles the leap year February issue. I gotta give credit where credit is due. Here is where I found the meat of this code.

    Code:
    Ext.apply(Ext.form.VTypes, {
    		'date': function(){
    			/************************************************
    			DESCRIPTION: Validates that a string contains only
    				valid dates with 2 digit month, 2 digit day,
    				4 digit year. Date separator can be ., -, or /.
    				Uses combination of regular expressions and
    				string parsing to validate date.
    				Ex. mm/dd/yyyy or mm-dd-yyyy or mm.dd.yyyy
    
    			PARAMETERS:
    			   strValue - String to be tested for validity
    
    			RETURNS:
    			   True if valid, otherwise false.
    
    			REMARKS:
    			   Avoids some of the limitations of the Date.parse()
    			   method such as the date separator character.
    			*************************************************/
    			  var objRegExp = /^\d{1,2}(\-|\/|\.)\d{1,2}\1\d{4}$/;
    			  return function(strValue){
    				  //check to see if in correct format
    				  if(!objRegExp.test(strValue))
    					return false; //doesn't match pattern, bad date
    				  else{
    					var strSeparator = strValue.substring(2,3) 
    					var arrayDate = strValue.split(strSeparator); 
    					//create a lookup for months not equal to Feb.
    					var arrayLookup = { '01' : 31,'03' : 31, 
    										'04' : 30,'05' : 31,
    										'06' : 30,'07' : 31,
    										'08' : 31,'09' : 30,
    										'10' : 31,'11' : 30,'12' : 31}
    					var intDay = parseInt(arrayDate[1],10); 
    
    					//check if month value and day value agree
    					if(arrayLookup[arrayDate[0]] != null) {
    					  if(intDay <= arrayLookup[arrayDate[0]] && intDay != 0)
    						return true; //found in lookup table, good date
    					}
    					
    					//check for February (bugfix 20050322)
    					//bugfix  for parseInt kevin
    					//bugfix  biss year  O.Jp Voutat
    					var intMonth = parseInt(arrayDate[0],10);
    					if (intMonth == 2) { 
    					   var intYear = parseInt(arrayDate[2]);
    					   if (intDay > 0 && intDay < 29) {
    						   return true;
    					   }
    					   else if (intDay == 29) {
    						 if ((intYear % 4 == 0) && (intYear % 100 != 0) || 
    							 (intYear % 400 == 0)) {
    							  // year div by 4 and ((not div by 100) or div by 400) ->ok
    							 return true;
    						 }   
    					   }
    					}
    				  }  
    				  return false; //any other values, bad date
    			}
    		}(),
    		'dateText' : 'The format is wrong, ie: 01/01/2007 | 01.01.2007 | 01-01-2007'
    	});
    -Hector Cervantes
    GIS Pro

  8. #18

    Default

    I need vtype for time with minute = 00 or 30
    ex. 12.00 or 23.00 or 22.30

    anyone can help me?

    thank's in advance.

  9. #19
    Sencha User hcervantes's Avatar
    Join Date
    Mar 2007
    Location
    Centerville, OH
    Posts
    80

    Default This might help

    This one does only valid numbers and periods. It might work for you.
    Code:
    //** Number **//
    	Ext.apply(Ext.form.VTypes, {
    		'numeric': function(){
    			
    				/*****************************************************************
    				DESCRIPTION: Validates that a string contains only valid numbers.
    				PARAMETERS:
    				   strValue - String to be tested for validity
    				RETURNS:
    				   True if valid, otherwise false.
    				******************************************************************/
    				  var objRegExp  =  /(^-?\d\d*\.\d*$)|(^-?\d\d*$)|(^-?\.\d\d*$)/;
    				  return function(strValue){
    					  //check for numeric characters
    					  return objRegExp.test(strValue);
    				  }
    		}(),
    		'numericText': 'Only numbers are allowed'
    	});
    -Hector Cervantes
    GIS Pro

  10. #20

    Default When working with file systems

    Here is a vType that verifies a proper directory location with a required trailing slash:

    Matches Win and Mac OS paths: x:\foo\bar\, \\foo\bar\, /foo/bar/

    Code:
    Ext.form.VTypes["directory"]=function(v){
     return /^(([a-zA-Z]:){0,1}(\\|\/){1})(([-_.a-zA-Z0-9\\\/ ]+)(\\|\/){1})+$/.test(v);
    } 
    Ext.form.VTypes["directoryText"]="This must be a valid directory location."
    Ext.form.VTypes["directoryMask"]=/[-_.a-zA-Z0-9\\\/: ]/;
    Not a regex guy, so if you find any errors in this please let me know

Page 2 of 5 FirstFirst 1234 ... LastLast

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •