Apr 28, 2023, 8:45 AM
Performance problem with dynamically sized grid
Hello
You can easilly reproduce the problem by clicking "simulate problem" in the example
Note that problem disappear if I set height of the grid explicitelly like this
Probably some kind of suspendEvents is required but I did not found where(grid, view, and store tried without sucess)
You can easilly reproduce the problem by clicking "simulate problem" in the example
Note that problem disappear if I set height of the grid explicitelly like this
Probably some kind of suspendEvents is required but I did not found where(grid, view, and store tried without sucess)
<ext:GridPanel Flex="1"
ID="GridPanel1"
runat="server"
Title="Array Grid"
Width="800"
Height="300"<%@ Page Language="C#" %>
<!DOCTYPE html>
<html>
<head runat="server">
<title>Simple Array Grid With Paging and Remote Reloading - Ext.NET Examples</title>
<script>
var template = '<span style="color:{0};">{1}</span>';
function simulateProblem() {
var grid = Ext.getCmp('GridPanel1')
var toAdd = [];
for (var i = 0; i < 500; i++) {
toAdd.push({
id: i,
company: 'company' + i,
hidden: i % 3 == 0
});
}
grid.store.add(toAdd);
}
</script>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" Namespace="" Theme="Gray" />
<ext:Viewport runat="server">
<Items>
<ext:Container runat="server" Layout="vbox">
<LayoutConfig>
<ext:VBoxLayoutConfig Align="Stretch"/>
</LayoutConfig>
<Items>
<ext:Button runat="server" OnClientClick="simulateProblem()" Text="Simulate problem" ></ext:Button>
<ext:GridPanel Flex="1"
ID="GridPanel1"
runat="server"
Title="Array Grid"
Width="800"
>
<Store>
<ext:Store ID="Store1" runat="server" AutoLoad="True" PageSize="10" RemoteSort="false" RemotePaging="false">
<Model>
<ext:Model runat="server" IDProperty="id">
<Fields>
<ext:ModelField Name="id" />
<ext:ModelField Name="company" />
<ext:ModelField Name="hidden" Type="Boolean" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<ColumnModel runat="server">
<Columns>
<ext:RowNumbererColumn runat="server" Width="35" />
<ext:Column runat="server" Text="Company" DataIndex="company" Flex="1" />
<ext:ComponentColumn DataIndex="company" Text="Company" Flex="1" runat="server" Editor="true">
<Component>
<ext:TextField runat="server" MaxLength="64" />
</Component>
</ext:ComponentColumn>
<ext:ComponentColumn DataIndex="IsRetired" Text="Retired" runat="server" Editor="true">
<Component>
<ext:Checkbox runat="server" />
</Component>
</ext:ComponentColumn>
<ext:CommandColumn Width="70">
<Commands>
<ext:GridCommand Icon="BinClosed" CommandName="Delete" Text="Delete">
<ToolTip Text="Delete" />
</ext:GridCommand>
</Commands>
</ext:CommandColumn>
</Columns>
</ColumnModel>
<SelectionModel>
<ext:RowSelectionModel runat="server" Mode="Multi" />
</SelectionModel>
<View>
<ext:GridView runat="server" StripeRows="true" />
</View>
</ext:GridPanel>
</Items>
</ext:Container>
</Items>
</ext:Viewport>
</form>
</body>
</html>
Originally Posted by jirihost
