1. #1
    Sencha - Community Support Team mystix's Avatar
    Join Date
    Mar 2007
    Location
    Singapore
    Posts
    6,236
    Vote Rating
    5
    mystix will become famous soon enough

      0  

    Default [1.0.1a] DateField fails to invoke custom vtype validator

    [1.0.1a] DateField fails to invoke custom vtype validator


    From what i gather from this thread, specifying a custom vtype (like in here) for a DateField should work because DateField calls
    Code:
    if(!Ext.form.DateField.superclass.validateValue.call(this, value)){
         return false;
    }
    but it doesn't seem to be invoking the associated custom validation method.

    My custom vtype follows:
    Code:
    Ext.apply(Ext.form.VTypes, {
      mydateMask : /[\d\/]/, // only allow numbers and '/' in date fields
      mydateText : "Date must be in DDMMYY, DD/MM/YY<br>or DD/MM/YYYY format",
      mydate : function(v) {
        var pd = Date.parseDate(v, 'dmy') || Date.parseDate(v, 'd/m/y') || Date.parseDate(v, 'd/m/Y');
        return (pd != null && (v.length == 6 || v.length == 8 || v.length == 10));
      }
    });
    When specifying vtype: 'mydate' in the DateField config, the mask mydateMask and invalidText mydateText are correctly applied, but the mydate validator is never called, and the default DateField format: 'm/d/y' and validator are used instead.

    Also, when the above custom vtype is used, entering exactly 6 characters (digits only) causes the invalid field QuickTip to display the default DateField invalidText i.e. "{0} is not a valid date - it must be in the format {1}". Entering any other combination of digits and slashes (i.e. '/') will display the custom invalidText mydateText.



    A complete test case follows:
    HTML Code:
    <html>
    <head>
      <title>DateField vtype test case</title>
      <link rel='stylesheet' href='ext-all.css'>
    
      <script src='yui-utilities.js'></script>
      <script src='ext-yui-adapter.js'></script>
      <script src='ext-all-debug.js'></script>
      <script>
        Ext.apply(Ext.form.VTypes, {
          mydateMask : /[\d\/]/, // only allow numbers and '/' in date fields
          mydateText : "Date must be in DDMMYY, DD/MM/YY<br>or DD/MM/YYYY format",
          mydate : function(v) {
            var pd = Date.parseDate(v, 'dmy') || Date.parseDate(v, 'd/m/y') || Date.parseDate(v, 'd/m/Y');
            return (pd != null && (v.length == 6 || v.length == 8 || v.length == 10));
          }
        });
        Ext.onReady(function() {
          Ext.QuickTips.init();
          var df = new Ext.form.DateField({
            menu: new Ext.menu.DateMenu(), // all DateFields will share the same DateMenu instance
            allowBlank: true,
            vtype: 'mydate'
          });
          df.applyTo('myText');
        });
      </script>
    </head>
    <body>
      <input type='text' id='myText' value=''/>
    </body>
    </html>

  2. #2
    Sencha User jack.slocum's Avatar
    Join Date
    Mar 2007
    Location
    Tampa, FL
    Posts
    6,955
    Vote Rating
    17
    jack.slocum will become famous soon enough jack.slocum will become famous soon enough

      0  

    Default


    You can't use vtypes to bypass the date field's date parsing/format logic. It will be parsing and formatting based on it's date format, not the one in your vtype.
    Jack Slocum
    Ext JS Founder
    Original author of Ext JS 1, 2 & 3.
    Twitter: @jackslocum
    jack@extjs.com

  3. #3
    Sencha - Community Support Team mystix's Avatar
    Join Date
    Mar 2007
    Location
    Singapore
    Posts
    6,236
    Vote Rating
    5
    mystix will become famous soon enough

      0  

    Default


    ah i see...

    i thought i could bypass the DateField's parsing / format logic cos i got this from the docs for DateField:
    Code:
    vtype
    vtype : String
    A validation type name as defined in Ext.form.VTypes (defaults to null)
    This config option is defined by TextField.
    i guess i'll just have to extend the DateField class to add custom parsing / formatting logic then.

    question: what's the vtype config option in DateField supposed to be used for?

  4. #4
    Sencha User jack.slocum's Avatar
    Join Date
    Mar 2007
    Location
    Tampa, FL
    Posts
    6,955
    Vote Rating
    17
    jack.slocum will become famous soon enough jack.slocum will become famous soon enough

      0  

    Default


    For validation, not for date parsing. E.g. comparing the date to another field's value maybe? I'm not sure, but someone will find a use for it.

    To implement custom parsing/formatting there are two functions abstracted on their own to make it easy: formatDate and parseDate
    Jack Slocum
    Ext JS Founder
    Original author of Ext JS 1, 2 & 3.
    Twitter: @jackslocum
    jack@extjs.com

  5. #5
    Sencha - Community Support Team mystix's Avatar
    Join Date
    Mar 2007
    Location
    Singapore
    Posts
    6,236
    Vote Rating
    5
    mystix will become famous soon enough

      0  

    Default


    alritey jack, thanks for the tip once again

    managed to accomplish the desired effect using:
    Code:
    var df = new Ext.form.DateField({
      menu : new Ext.menu.DateMenu(),
      allowBlank : true,
      maskRe : /[\d\/]/, // only allow numbers and '/'
      invalidText : [
        "Date must be in <ul>",
        "<li>- DDMMYY</li>",
        "<li>- DD/MM/YY</li>",
        "<li>- or DD/MM/YYYY</li>",
        "</ul>format"
      ].join(""),
      format : 'd/m/Y',
      parseDate : function(v) {
        return (!v || v instanceof Date) ?
          v : ((v.length == 6 || v.length == 8 || v.length == 10) 
               && (Date.parseDate(v, 'dmy') || Date.parseDate(v, 'd/m/y') || Date.parseDate(v, 'd/m/Y')));
      }
    });
    i've also submitted a bug in the missing docs thread regarding DateField's parseDate and formatDate functions.
    Last edited by mystix; 17 May 2007 at 8:59 AM. Reason: removed misleading comment -- DateFields will share the same menu instance only if they use the same config object.

  6. #6
    Sencha User
    Join Date
    Nov 2009
    Posts
    93
    Vote Rating
    0
    roshniblr is on a distinguished road

      0  

    Default


    Hi ,

    I want to restrict any other format other than m/d/y and d/m/y.
    But if I use
    parseDate : function(v) {
    return (!v || v instanceof Date) ?
    v : (Date.parseDate(v, 'm/d/y')||Date.parseDate(v, 'd/m/y'));
    },
    then if i set format as d/m/y, and select the date as 08/07/09, then in the popup calendar 8 should be highlighted instead its highlighting 07 .
    How to handle this?

  7. #7
    Sencha - Community Support Team mystix's Avatar
    Join Date
    Mar 2007
    Location
    Singapore
    Posts
    6,236
    Vote Rating
    5
    mystix will become famous soon enough

      0  

    Default


    Quote Originally Posted by roshniblr View Post
    Hi ,

    I want to restrict any other format other than m/d/y and d/m/y.
    But if I use
    parseDate : function(v) {
    return (!v || v instanceof Date) ?
    v : (Date.parseDate(v, 'm/d/y')||Date.parseDate(v, 'd/m/y'));
    },
    then if i set format as d/m/y, and select the date as 08/07/09, then in the popup calendar 8 should be highlighted instead its highlighting 07 .
    How to handle this?
    http://extjs.com/docs/?class=Ext.for...ber=altFormats

Thread Participants: 2

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..."