Results 1 to 9 of 9

Thread: [2.1 revision 2350][DUP][FIXED] DateField: Change event fireing all the time

  1. #1
    Ext JS Premium Member
    Join Date
    Apr 2007
    Posts
    298

    Default [2.1 revision 2350][DUP][FIXED] DateField: Change event fireing all the time

    Just checkout the sources and examples from SVN.

    Then edit the example examples/form/adv-vtypes.js:

    PHP Code:
    items: [{
            
    fieldLabel'Start Date',
            
    name'startdt',
            
    id'startdt',
            
    vtype'daterange',
            
    endDateField'enddt' // id of the end date field
          
    },{ 
    to
    PHP Code:
    items: [{
            
    fieldLabel'Start Date',
            
    name'startdt',
            
    id'startdt',
            
    // new
            
    listeners: {
             
    change: function () { console.log ('change-event'); }
             },
            
    // /new
            
    vtype'daterange',
            
    endDateField'enddt' // id of the end date field
          
    },{ 
    You will see that after you change the date using the trigger the change event is triggered everytime you click on the page (until you click in the field again).

    As requested here's the complete source:

    html:
    PHP Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <
    html>
    <
    head>
    <
    meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <
    title>Advanced VType Examples</title>

    <
    link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
         <
    script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>
      <script type="text/javascript" src="../../ext-all-debug.js"></script>
      
      <script type="text/javascript" src="adv-vtypes.js"></script>
      <script type="text/javascript" src="states.js"></script>

    <!-- Common Styles for the examples -->
    <link rel="stylesheet" type="text/css" href="../shared/examples.css" />
    </head>

    <body>
    <h1>Advanced Validation Examples Using VTypes</h1>

    <div id="dr"><p>The first example shows two date fields acting as a date range.  Selecting an initial date
    sets the minimum value for the end field.  Selecting an ending date sets a maximum value for the
    start field.</p></div>

    <div id="pw" style="padding-top:20px"><p>This second example shows a password verification,
     the second value must be equivalent to the first to validate.</p></div><br/>

    <p>The js is not minified so it is readable. See <a href="adv-vtypes.js">adv-vtypes.js</a>.</p>
    </body>
    </html> 
    JS:
    PHP Code:
    /*
     * Ext JS Library 2.1
     * Copyright(c) 2006-2008, Ext JS, LLC.
     * [email protected]
     * 
     * http://extjs.com/license
     */

    // Add the additional 'advanced' VTypes
    Ext.apply(Ext.form.VTypes, {
      
    daterange: function(valfield) {
        var 
    date field.parseDate(val);
        
        
    // We need to force the picker to update values to recaluate the disabled dates display
        
    var dispUpd = function(picker) {
          var 
    ad picker.activeDate;
          
    picker.activeDate null;
          
    picker.update(ad);
        };
        
        if (
    field.startDateField) {
          var 
    sd Ext.getCmp(field.startDateField);
          
    sd.maxValue date;
          if (
    sd.menu && sd.menu.picker) {
            
    sd.menu.picker.maxDate date;
            
    dispUpd(sd.menu.picker);
          }
        } else if (
    field.endDateField) {
          var 
    ed Ext.getCmp(field.endDateField);
          
    ed.minValue date;
          if (
    ed.menu && ed.menu.picker) {
            
    ed.menu.picker.minDate date;
            
    dispUpd(ed.menu.picker);
          }
        }
        
    /* Always return true since we're only using this vtype
         * to set the min/max allowed values (these are tested
         * for after the vtype test)
         */
        
    return true;
      },
      
      
    password: function(valfield) {
        if (
    field.initialPassField) {
          var 
    pwd Ext.getCmp(field.initialPassField);
          return (
    val == pwd.getValue());
        }
        return 
    true;
      },
      
      
    passwordText'Passwords do not match'
    });


    Ext.onReady(function(){

        
    Ext.QuickTips.init();

        
    // turn on validation errors beside the field globally
        
    Ext.form.Field.prototype.msgTarget 'side';

        var 
    bd Ext.getBody();

            
    /*
             * ================  Date Range  =======================
             */
        
        
    var dr = new Ext.FormPanel({
          
    labelWidth125,
          
    frametrue,
          
    title'Date Range',
          
    bodyStyle:'padding:5px 5px 0',
          
    width350,
          
    defaults: {width175},
          
    defaultType'datefield',
          
    items: [{
            
    fieldLabel'Start Date',
            
    name'startdt',
            
    id'startdt',

            
    //format: 'd.m.y',
            
    listeners: {
             
    change: function () { console.log ('change-event'); }
             },
            
    vtype'daterange',
            
    endDateField'enddt' // id of the end date field
          
    },{
            
    fieldLabel'End Date',
            
    name'enddt',
            
    id'enddt',
            
    vtype'daterange',
            
    startDateField'startdt' // id of the start date field
          
    }]
        });

        
    dr.render('dr');
        
        
    /*
         * ================  Password Verification =======================
         */
            
        
    var pwd = new Ext.FormPanel({
          
    labelWidth125,
          
    frametrue,
          
    title'Password Verification',
          
    bodyStyle:'padding:5px 5px 0',
          
    width350,
          
    defaults: {
            
    width175,
            
    inputType'password'
          
    },
          
    defaultType'textfield',
          
    items: [{
            
    fieldLabel'Password',
            
    name'pass',
            
    id'pass'
          
    },{
            
    fieldLabel'Confirm Password',
            
    name'pass-cfrm',
            
    vtype'password',
            
    initialPassField'pass' // id of the initial password field
          
    }]
        });

        
    pwd.render('pw');
    }); 

  2. #2
    Ext JS Premium Member
    Join Date
    Apr 2007
    Posts
    298

    Default

    Will it be fixed, did you see it? It's strange when I get the instruction to post a bug report in the premium help board but couldn't see any reaction on it.

  3. #3
    Sencha User
    Join Date
    Mar 2007
    Location
    Bédoin/Nottingham
    Posts
    30,890

    Default

    The TriggerField's (DateField extends TriggerField) mousedown listener is not being removed because the "un" call does not include the scope.

    It's added on focus:

    Code:
        onFocus : function(){
            Ext.form.TriggerField.superclass.onFocus.call(this);
            if(!this.mimicing){
                this.wrap.addClass('x-trigger-wrap-focus');
                this.mimicing = true;
                Ext.get(Ext.isIE ? document.body : document).on("mousedown", this.mimicBlur, this, {delay: 10});
                if(this.monitorTab){
                    this.el.on("keydown", this.checkTab, this);
                }
            }
        },
    The code to remove it needs the scope to match:

    Code:
    Ext.override(Ext.form.TriggerField, {
        triggerBlur : function(){
            this.mimicing = false;
            Ext.get(Ext.isIE ? document.body : document).un("mousedown", this.mimicBlur, this);
            if(this.monitorTab){
                this.el.un("keydown", this.checkTab, this);
            }
            this.beforeBlur();
            this.wrap.removeClass('x-trigger-wrap-focus');
            Ext.form.TriggerField.superclass.onBlur.call(this);
        }
    });

  4. #4
    Sencha User
    Join Date
    Mar 2007
    Location
    Bédoin/Nottingham
    Posts
    30,890

    Default

    I thought I recognized this.

    It's been found and reported before: http://extjs.com/forum/showthread.php?t=38048

    No action from the dev team yet...

  5. #5
    Ext JS Premium Member
    Join Date
    Apr 2007
    Posts
    298

    Default

    I haven't seen any commit message in the SVN regarding this issue... Will it be fixed?

  6. #6
    Sencha User
    Join Date
    Mar 2007
    Location
    Bédoin/Nottingham
    Posts
    30,890

    Default

    There are loads of outanding reports, that none of us have any idea about being fixed. Have the team seen them? Are they logged on Ext's internal tracker? If so, when fixes were suggested in the report threads, how come the fixes aren't being committed?

    I have bug reports which have dropped back 11 or 12 pages in the Bugs folder.

    Even if we can't write to Ext's bug tracker, they could at least make a read-only version available to us!

  7. #7
    Ext JS Premium Member
    Join Date
    Apr 2007
    Posts
    298

    Default

    Hello Ext-developers. Is this a forum a placebo pill for people or is anybody of the dev team looking at the bugs???

  8. #8
    Sencha User
    Join Date
    Apr 2012
    Location
    Austin, Texas
    Posts
    4

    Default

    We've been a bit backed up on working the bug forum recently, but that will improve soon. Please have some patience.

    This is fixed in SVN (thanks Animal).

  9. #9
    Ext JS Premium Member
    Join Date
    Apr 2007
    Posts
    298

    Default

    Okay, no problem. Thanks for the answer.

Posting Permissions

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