Sep 18, 2015, 6:03 PM
[FIXED] [#903] [3.3] ComboBox boundlist disappears after grid horizontal scroll
This was fun to isolate (not really). Tested against 3.2.1 SVN rev 6569. Happens in IE11. Not an issue in Firefox as far as I could tell. I tested the JS-only version (below) against Sencha Fiddle to see if it was coming from Ext JS and it's present in 5.1.1.451 but not 6.0.1.250.
Steps to elicit the issue:
Steps to elicit the issue:
- Click the trigger in the window combo to cause the combo's boundlist to render. (You don't have to select anything.)
- Close the window, and scroll the grid horizontally right 3/4 of the way or so. If you have the DOM explorer on, you can see the boundlist's top and left style attributes change to something strange.
- Click 'Show Window' to bring the window back up.
- Click the combo's trigger again - it doesn't appear as expected. (If it does, repeat steps 2-4 to try again.)
<%@ Page Language="C#" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<ext:ResourceManager runat="server" />
<ext:GridPanel runat="server" ID="MainGrid" Height="200" Width="250">
<Store>
<ext:Store runat="server" ID="GridStore">
<Fields>
<ext:ModelField Name="fld1" Type="Int" />
<ext:ModelField Name="fld2" Type="String" />
<ext:ModelField Name="fld3" Type="String" />
</Fields>
</ext:Store>
</Store>
<ColumnModel>
<Columns>
<ext:Column runat="server" Text="field 1" DataIndex="fld1" Width="300" />
<ext:Column runat="server" Text="field 2" DataIndex="fld2" Width="300" />
<ext:Column runat="server" Text="field 3" DataIndex="fld3" Width="300" />
</Columns>
</ColumnModel>
<TopBar>
<ext:Toolbar runat="server">
<Items>
<ext:Button runat="server" Text="Show Window" Handler="#{TestWindow}.show();" />
</Items>
</ext:Toolbar>
</TopBar>
</ext:GridPanel>
<ext:Window runat="server" ID="TestWindow"
CloseAction="Hide"
Modal="true"
Height="300"
Width="300">
<Items>
<ext:ComboBox runat="server"
QueryMode="Local"
ValueField="code"
DisplayField="desc">
<Items>
<ext:ListItem Value="a" Text="One" />
<ext:ListItem Value="b" Text="Two" />
<ext:ListItem Value="c" Text="Three" />
</Items>
</ext:ComboBox>
</Items>
</ext:Window>
</body>
</html>Ext.onReady(function() {
var testWindow = new Ext.window.Window({
closeAction: 'hide',
height: 300,
width: 300,
items: [{
xtype: "combobox",
displayField: "desc",
queryMode: "local",
valueField: "code",
store: [
["a", "One"],
["b", "Two"],
["c", "Three"]
]
}],
modal: true
});
Ext.create("Ext.grid.Panel", {
renderTo: Ext.getBody(),
height: 200,
width: 250,
store: {
fields: [{
name: "fld1",
type: "int"
}, {
name: "fld2",
type: "string"
}, {
name: "fld3",
type: "string"
}]
},
tbar: {
xtype: "toolbar",
items: [{
handler: function() {
testWindow.show();
},
text: "Show Window"
}]
},
columns: [{
dataIndex: "fld1",
text: "field 1",
width: 300
}, {
dataIndex: "fld2",
text: "field 2",
width: 300
}, {
dataIndex: "fld3",
text: "field 3",
width: 300
}]
});
testWindow.show();
});
Last edited by Daniil; Oct 16, 2015 at 10:42 AM.
Reason: [FIXED] [#903] [3.3]
