Resizers on FormFields don't show up

[tvanzoelen]

In the Beta[2]

Ext.onReady(function() {

    var simple = Ext.create('Ext.form.Panel', {
        url: 'save-form.php',
        frame: true,
        title: 'Simple Form',
        bodyStyle: 'padding:5px 5px 0',
        width: 350,
        
        defaultType: 'textfield',
        layout: 'auto',

        items: [{
            fieldLabel: 'First Name',
            name: 'first',
            resizable: true,
            allowBlank: false
}]
        });

        simple.render(document.body);
    });

Setting the resizer on a formfield doesn't give an error anymore but the resizers don't show up when putting them on a formfield. How can I get them visible?

[kevhender]

I made a bug for this:

http://www.sencha.com/forum/showthread.php?176881

[tvanzoelen]

Can we get an answer on this one, or should I open a ticket for this?

[tvanzoelen]

I got the resizers back with this workaround.

Ext.define('My.layout.FormResize', {

    /* Begin Definitions */
    alias: ['layout.formresize', 'layout.autocontainer'],

    extend: 'Ext.layout.container.Auto',
    /* End Definitions */

    type: 'formresize',

    isValidParent: function(item, target, position) {
        var itemDom = item.el ? item.el.dom : Ext.getDom(item),
            targetDom = (target && target.dom) || target;

        if (itemDom && targetDom) {
            if (typeof position == 'number') {

                var itemId = itemDom.id;
                var itemIdWrapped = itemId + '-rzwrap';
                var targetId = targetDom.childNodes[position].id;

                return (itemId == targetId) || (itemIdWrapped == targetId);

            }
            return itemDom.parentNode == targetDom;
        }

        return false;
    }
});

Ext.onReady(function() {

    var formPanel = Ext.create('Ext.form.Panel', {
        frame: true,
        title: 'Form Fields',
        width: 340,
        renderTo: Ext.getBody(),
        bodyPadding: 5,

        //layout: {type: 'table', columns: 1},
        layout: 'formresize',

        fieldDefaults: {
           
            width: 150
        },

        items: [{
            xtype: 'textfield',
            name: 'textfield1',

            listeners: {

            render:
            {
                fn: function(component, eOpts) {

                    var resizer = Ext.create('Ext.resizer.Resizer', {                        
                        target: this.el
                    });
                }
            }
            },

            fieldLabel: 'Text field',
            value: 'Text field value'
        }]
        });
    });

The problem lies in isValidParent. That function returns false if the formfield is wrapped in cause of a set resizer. In that case the resizer was moved in the dom. The move shouldn't be a big problem if the setBox() in the contructor of the resizer was returning the correct measures during rendertime, but each updateLayout of the container was messing the sizes up again.

Hopefully this bug is fixed in the next release.