You found a bug! We've classified it as EXTJS-5638 . We encourage you to continue the discussion and to find an acceptable workaround while we work on a permanent fix.
  1. #1
    Sencha Premium Member
    Join Date
    Apr 2009
    Posts
    104
    Vote Rating
    0
    jej2003 is on a distinguished road

      0  

    Default Disabling a FieldContainer makes children almost invisible

    Disabling a FieldContainer makes children almost invisible


    REQUIRED INFORMATIONExt version tested:
    • Ext 4.1.0-rc1
    • Ext 4.1.0-beta2
    Browser versions tested against:
    • IE8
    • FF10 (firebug 1.3.0.10 installed)
    • Safari 5
    Description:
    • disabling a field container also disables all of it's children, making them almost impossible to see.
    Steps to reproduce the problem:
    • run the example
    The result that was expected:
    • FieldContainer disabled, but still being able to see the children
    The result that occurs instead:
    • FieldContainer is disabled but children are very difficult to see
    Test Case:
    Code:
         Ext.onReady(function() {
    
    
       var k_panel = Ext.create('Ext.form.Panel', {
       dockedItems: [
                    {
                        xtype: 'toolbar',
                        flex: 1,
                        dock: 'top',
                        items: [
                            
                            {
                                xtype: 'tbfill',
                                flex: 1
                            },{
                                xtype : 'button',
                                text : '+',
                                listeners : {
                                    click : function(){
                                        window.setHeight(window.getHeight() + 1);
                                        console.log(window.getHeight());
                                    }
                                }
                            },{
                                xtype : 'button',
                                text : '-',
                                listeners : {
                                    click : function(){
                                        window.setHeight(window.getHeight() - 1);
                                        console.log(window.getHeight());
                                    }
                                }
                            },
                            {
                                xtype: 'button',
                                disabled: false,
                                itemId: 'addTypeButton',
                                iconCls: 'silk-add',
                                label : 'blah',
                                listeners : {
                                    click : function(){
                                        k_panel.down('#typeContainer').add({
                                            collapsible : true,
                                            flex : 1,
                                            title : 'test',
                                            xtype: 'fieldset',
                                            //id : 'fieldset',
                                            items : [{
                                                xtype : 'checkbox',
                                
                                            },{
                                                xtype : 'fieldcontainer',
                                                disabled : true,
                                                items : [ {
                                                    xtype: 'label',
                                                    text : 'hi'
                                            },
                                            {
                                                xtype: 'textfield',
                                                flex: 1,
                                                itemId: 'valueField',
                                                width : 400
                                            }]
                                        }]
                                        });
                                    },
                                    scope : k_panel
                                }
                            }
                        ]
                    },
                    {
                        xtype: 'toolbar',
                        flex: 1,
                        dock: 'bottom',
                        items: [
                            {
                                xtype: 'tbfill'
                            },
                            {
                                xtype: 'button',
                                disabled: false,
                                id: '',
                                itemId: 'submitButton',
                                iconCls: 'silk-magnifier ',
                                formBind: true
                            },
                            {
                                xtype: 'button',
                                itemId: 'clearButton',
                                iconCls: 'silk-cross'
                            }
                        ]
                    }
                ],
        layout: {
            align: 'stretch',
            type: 'vbox'
        },
        items: [{
                        xtype: 'container',
                        id: 'typeContainer',
                        autoScroll: true,
                        layout: {
                            type: 'anchor'
                        },
                        items : [{
                                            collapsible : true,
                                            flex : 1,
                                            title : 'test',
                                            xtype: 'fieldset',
                                            items : [{
                                                xtype : 'checkbox',
                                
                                            },{
                                                disabled : true,
                                                xtype : 'fieldcontainer',
                                                layout : 'fit',
                                                items : [ {
                                                    xtype: 'label',
                                                    text : 'hi'
                                                },
                                                {
                                                    xtype: 'textfield',
                                                    flex: 1,
                                                    itemId: 'valueField'
                                                }]
                                        }]
                                }],
                        flex: 1
                    }
                ]
        });
        var window = Ext.create('Ext.window.Window', {
            layout : 'fit',
            height : 201,
            width : 432,
            items : [k_panel],
                renderTo: Ext.getBody()
        });
        window.show();
        });
    HELPFUL INFORMATIONScreenshot or Video:
    • attached
    Debugging already done:
    • none
    Possible fix:
    • Mask children individually
    Additional CSS used:
    • only default ext-all.css
    Operating System:
    • OSX
    Attached Images

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,824
    Vote Rating
    836
    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


    Thanks for the report.
    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.

Thread Participants: 1