Success! Looks like we've fixed this one. According to our records the fix was applied for EXTJS-5193 in a recent build.
  1. #1
    Sencha User
    Join Date
    Jul 2008
    Posts
    96
    Vote Rating
    0
    ritcoder is on a distinguished road

      0  

    Question [4.1.0 beta 1] No resize event is fired for custom form field

    [4.1.0 beta 1] No resize event is fired for custom form field


    Hi,
    I'm creating an extjs text field from the codemirror library. Interestingly, the resize event never fires. I even took out anything to do with codemirror and it still didn't fire.

    The code for the custom field is
    Code:
    /**
     * Wrapper around the CodeMirror control
     */
    Ext.define('Ext.form.field.CodeEditor', {
        extend: 'Ext.form.field.TextArea',
        alias: 'widget.codeeditorx',
    
        initComponent: function () {
            this.callParent();
            this.on({
                afterrender: this.setupEditor,
                resize: function (field, width, height) {
                    var el = this.getEl();
                    console.log('resized');
                }
            });
        },
    
        setupEditor: function () {
            console.log('this will setup the control');
        },
        getValue: function () { return this.editor ? this.editor.getValue() : ''; },
        setValue: function (text) { this.editor && this.editor.setValue(text); },
        getRawValue: function () { return this.getValue() },
        setRawValue: function (text) { this.setValue(text); }
    });
    the code for testing is
    Code:
    //new JSPad page
    var p = Ext.create('Ext.panel.Panel',{
        items: [Ext.create('Ext.form.field.CodeEditor',{options:{mode:'javascript'}})],
        layout:'fit',autoScroll:false
    });
    window.p = p;
    var win = Ext.create('Ext.window.Window',{layout:'fit',items : p,width:300,height:400});
    win.show();
    Is this a bug or I'm doing something wrong?

    regards.

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,330
    Vote Rating
    847
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    I actually moved this to the bugs forum as your code worked fine in 4.0.7 but not in 4.1.0 beta 1
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Ext JS Premium Member
    Join Date
    Mar 2008
    Location
    Phoenix, AZ
    Posts
    628
    Vote Rating
    10
    zombeerose will become famous soon enough zombeerose will become famous soon enough

      0  

    Default [4.1B3] Resize event is not fired for text fields

    [4.1B3] Resize event is not fired for text fields


    REQUIRED INFORMATION

    Ext version tested:
    • Ext 4.1 beta 3
    Browser versions tested against:
    • Chrome 17
    DOCTYPE tested against:
    • Strict
    Description:
    • Resizing a form text field does not fire the 'resize' event.
    • This also applies to all subclasses of Ext.form.field.Text.
    Steps to reproduce the problem:
    • Run the code.
    • Drag the border of the panel to resize the component.
    • Two messages should be logged in the console - one for the panel resize and one for the field.
    The result that was expected:
    • The 'resize' event for both the panel and the field should fire.
    The result that occurs instead:
    • The 'resize' event is not fired.
    Test Case:
    Code:
    var cmp = Ext.create('Ext.panel.Panel',{
        resizable: true,
        width: 100,
        height: 100,
        frame: true,
        items: [{
            anchor: '100% 100%',
            listeners: {
                'resize': function(){
                    console.log('Field was resized',arguments);
                }
            },
            value: 'Value of field',
            xtype: 'textarea'
        }],
        layout: 'anchor',
        listeners: {
            'resize': function(){
                console.log('Panel was resized',arguments);
            }
        },
        title: 'Resize Me',
        renderTo: Ext.getBody()
    });

    HELPFUL INFORMATION

    Additional CSS used:
    • only default ext-all.css
    Operating System:
    • WinXP Pro

  4. #4
    Sencha - Community Support Team mankz's Avatar
    Join Date
    Nov 2007
    Location
    Stockholm, Sweden
    Posts
    2,759
    Vote Rating
    108
    mankz is a name known to all mankz is a name known to all mankz is a name known to all mankz is a name known to all mankz is a name known to all mankz is a name known to all

      0  

    Default


    Something's fishy, I can see this in RC1 too. Even if putting resizable : true on the text area it doesn't fire any resize event after resize.

  5. #5
    Ext JS Premium Member
    Join Date
    Mar 2008
    Location
    Phoenix, AZ
    Posts
    628
    Vote Rating
    10
    zombeerose will become famous soon enough zombeerose will become famous soon enough

      0  

    Default


    Here is a smaller test case...
    Code:
    Ext.widget({ 
      xtype:'textfield',   
      renderTo: Ext.getBody(), 
      resizable:true,  
      listeners:{
        resize:function(){ console.log('resize'); }
      }  
    });

  6. #6
    Ext JS Premium Member
    Join Date
    Mar 2008
    Location
    Phoenix, AZ
    Posts
    628
    Vote Rating
    10
    zombeerose will become famous soon enough zombeerose will become famous soon enough

      0  

    Default


    Reviewing the RC2 release notes - bug EXTJSIV-5193 is not listed anywhere - fixed or known issues. Any more info would be nice...

  7. #7
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,330
    Vote Rating
    847
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    This has been pushed back to 4.2 with an option for a possible 4.1.x inclusion.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  8. #8
    Ext JS Premium Member
    Join Date
    Mar 2008
    Location
    Phoenix, AZ
    Posts
    628
    Vote Rating
    10
    zombeerose will become famous soon enough zombeerose will become famous soon enough

      0  

    Default


    @mitchellsimoens

    That is quite disappointing. Do you have any suggestions how to deal with this in the interim?

  9. #9
    Ext JS Premium Member
    Join Date
    Mar 2008
    Location
    Phoenix, AZ
    Posts
    628
    Vote Rating
    10
    zombeerose will become famous soon enough zombeerose will become famous soon enough

      0  

    Default


    I believe I have identified the problem and it is a super simple fix.

    In the Ext.form.field.Text class, the redefined method afterComponentLayout does not pass arguments to the parent method, which means the size params are all undefined and never change.

    Here is the fix for the Ext.form.field.Text source...
    Code:
        afterComponentLayout: function() {
            var me = this,
                width;
    
    
            me.callParent(arguments); //ADD ARGUMENTS HERE
            if (me.autoSizing) {
                width = me.inputEl.getWidth();
                if (width !== me.lastInputWidth) {
                    me.fireEvent('autosize', me, width);
                    me.lastInputWidth = width;
                    delete me.autoSizing;
                }
            }
        }

    Here is a temp override...
    Code:
    Ext.define('Ext.form.field.TextOverride',{
        override: 'Ext.form.field.Text',
        
        afterComponentLayout: function() {
            var me = this,
                width;
    
    
            //need to bypass the Text implementation
            //me.callParent(); 
            Ext.form.field.Base.prototype.afterComponentLayout.apply(me,arguments); 
            if (me.autoSizing) {
                width = me.inputEl.getWidth();
                if (width !== me.lastInputWidth) {
                    me.fireEvent('autosize', me, width);
                    me.lastInputWidth = width;
                    delete me.autoSizing;
                }
            }
        }
    });
    Please fix this before GA.

  10. #10
    Ext JS Premium Member
    Join Date
    Sep 2011
    Posts
    26
    Vote Rating
    0
    dmurat is on a distinguished road

      0  

    Default


    +1 for fixing this before GA.
    Fix by zombeerose works perfectly for me. Thank you very much, zombeerose.