JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="http://dev.sencha.com/deploy/ext-4.0.2a/resources/css/ext-all.css">
<html>
<head>
<title>ExtJS4 Button-Menu-Combo Focus Bug</title>
</head>
<body>
</body>
</html>
JavaScript
// ExtJS 4 Button-Menu-Combo Focus Bug
//**************************//
Ext.onReady(function(){
Ext.create('Ext.Window',{
title: 'ExtJS 4 Button-Menu-Combo Focus Bug'
, width: 300
, height: 200
, items: [{
xtype: 'button',
text: 'Show Menu /w Combo',
menu: {
xtype : 'menu'
plain: true,
items: [
{
xtype: 'combo',
width: 300,
queryMode: 'local',
typeAhead: true,
forceSelection: true,
minChars: 1,
displayField: 'name',
valueField: 'abbr',
store: Ext.create('Ext.data.Store', {
fields: ['abbr','name'],
data: [
{"abbr":"AL", "name":"Alabama"},
{"abbr":"AK", "name":"Alaska"},
{"abbr":"AZ", "name":"Arizona"}
]
})
},
{
xtype: 'button',
text: 'Process'
}
]
}
}]
}).show();
});