Combobox bug when FocusManager enabled, automaticaly set value.

**Qarea** · 11 Feb 2013 3:08 AM

REQUIRED INFORMATION

Ext version tested:

Ext 4.2.0.376
Ext 4.1.3
Ext 4.1.1

Browser versions tested against:

FF9 Ubuntu 12.10
Chromium 24 Ubuntu 12.10
FF9 Windows7

DOCTYPE tested against:

html

Description:

Combobox value changed automaticaly when focus moves to the next item in a list.

Steps to reproduce the problem:

Run the sample in appropriate browser
Press "Enter" key - focus will be set to the viewport
Press "Enter" again - focus frame will be set to panel header
Press "ArrowDown" key - focus will be set to combobox
Press "ArrowDown" key again - combobox data will be loaded and items list opened, But focus will be set to the Viewport
Press "ArrowDown" key - focus will be set to opened combobox items list
Press "ArrowDown" key - will be selected first item and combobox value changed to its value. Focus frame jump again to Viewport

The result that was expected:

First item from combobox should be selected but combobox value doesn't changed.
Combobox list focus should move through all items without changing combobox value

The result that occurs instead:

Focus frame always jumps to Viewport
Combobox value sets automaticaly when list focus moves to the next item in a list

Test Case:

Code:

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Test extjs project</title>

        <!-- <link href="http://cdn.sencha.io/ext-4.1.1-gpl/resources/css/ext-all.css" rel="stylesheet" type="text/css" />
        <script type="text/javascript" charset="utf-8" src="http://cdn.sencha.io/ext-4.1.1-gpl/ext-all.js"></script> -->
        <!-- <link href="/ext-4.1.3/resources/css/ext-all.css" rel="stylesheet" type="text/css" />
        <script type="text/javascript" charset="utf-8" src="/ext-4.1.3/ext-all.js"></script> -->
        <link href="/ext-4.2.0.376/resources/css/ext-all.css" rel="stylesheet" type="text/css" />
        <script type="text/javascript" charset="utf-8" src="/ext-4.2.0.376/ext-all.js"></script>

        <script type="text/javascript">
            Ext.onReady(function(){
                Ext.define("Post", {
                    extend: 'Ext.data.Model',
                    proxy: {
                        type: 'jsonp',
                        url : 'http://www.sencha.com/forum/topics-remote.php',
                        reader: {
                            type: 'json',
                            root: 'topics',
                            totalProperty: 'totalCount'
                        }
                    },

                    fields: [
                        {name: 'id', mapping: 'post_id'},
                        {name: 'title', mapping: 'topic_title'},
                        {name: 'topicId', mapping: 'topic_id'},
                        {name: 'author', mapping: 'author'},
                        {name: 'lastPost', mapping: 'post_time', type: 'date', dateFormat: 'timestamp'},
                        {name: 'excerpt', mapping: 'post_text'}
                    ]
                });

                ds = Ext.create('Ext.data.Store', {
                    model: 'Post'
                });

                Ext.create('Ext.container.Viewport', {
                    layout: 'fit',
                    items: [{
                        region: 'center',
                        xtype: 'panel',
                        focusOnToFront: true,
                        title: 'Search the Ext Forums',
                        width: 600,
                        bodyPadding: 10,
                        layout: 'anchor',
                        padding: 100,

                        items: [{
                            xtype: 'combo',
                            store: ds,
                            displayField: 'title',
                            anchor: '100%',
                            editable: false,
                            queryCaching: false,
                            labelAlign: 'top',
                            fieldLabel: 'Feature',
                            editable:   false,
                            value: 'Select Feature',
                            listConfig: {
                                loadingText: 'Searching...',
                                emptyText: 'No matching posts found.',
                            },
                            listeners: {
                                change: function () {
                                    alert('change');
                                }
                            }
                        }, {
                            xtype: 'component',
                            style: 'margin-top:10px',
                            html: 'Live search requires a minimum of 4 characters.'
                        }]
                    }]
                });

                Ext.FocusManager.enable(true);
            });
        </script>
    </head>
    <body>
    </body>
</html>

HELPFUL INFORMATION

Screenshot or Video:

Video - http://youtu.be/ym2eNlMEqHY

See this URL for live test case: http://

Debugging already done:

none

Possible fix:

not provided

Additional CSS used:

only default ext-all.css

Operating System:

Ubuntu 12.10
Windows 7

**mitchellsimoens** · 11 Feb 2013 9:20 AM

Thanks for the report! I have opened a bug in our bug tracker.

Combobox bug when FocusManager enabled, automaticaly set value.

Thread Tools

Search Thread

Display

Combobox bug when FocusManager enabled, automaticaly set value.

Combobox bug when FocusManager enabled, automaticaly set value.