Friday, 25 September 2015

ExtJs 5 - Mouse scroll is not handled properly

Hello Folks,

While am working with ExtJs 5 am facing a problem with Combobox picker. When am scrolling picker is misplaced it is also moving.

Code:

 Ext.onReady(function () {
    var configs = [{
        title: 'Parent Panel',
        width: 300,
        manageHeight: false,
        html: null,
        autoScroll: true,
        frame: true,
        layout: 'fit',
        items: [
        {
            xtype: 'panel',
            manageHeight: false,
            height: 170,
            autoScroll: true,
            width: 100,
            title: 'child-frame',
            items: [{
                xtype: 'combobox',
                typeAhead: true,
                triggerAction: 'all',
                editable: true,
                selectOnTab: true,

                store: [
                ['AA', 'Aogashima'],
                ['B Shady', 'Petra'],
                ['C or Shade', 'Hiller lake'],
                ['D Sunny', 'Chittorgarh '],
                ['E', 'Cinque Terre']
                ],
                lazyRender: true,
                listClass: 'x-combo-list-small'
            }, {
                xtype: 'textfield'
            }, {
                xtype: 'textfield'
            }, {
                xtype: 'textfield'
            }, {
                xtype: 'textfield'
            }, {
                xtype: 'textfield'
            }, {
                xtype: 'textfield'
            }, {
                xtype: 'combobox',
                typeAhead: true,
                triggerAction: 'all',
                editable: true,
                selectOnTab: true,
                store: [
                ['AA', 'Aogashima'],
                ['B Shady', 'Petra'],
                ['C or Shade', 'Hiller lake'],
                ['D Sunny', 'Chittorgarh '],
                ['E', 'Cinque Terre']
                ],
                lazyRender: true,
                listClass: 'x-combo-list-small',
                listeners: {
                    'select': function () {
                        alert(5)
                    }
                }
            }]
            // html : 'Hello'
        }

        ]
    }];

    Ext.each(configs, function (config) {
        var element = Ext.getBody().createChild({ cls: 'panel-container' });

        Ext.widget('panel', Ext.applyIf(config, {
            renderTo: element,
            bodyPadding: 7
        }));
    });
});


Is there any solution for this.


No comments:

Post a Comment