Jan 08, 2022, 2:09 PM
[OPEN] [#1870] Stateful grid with cell editing - reconfiguration causes the cell editor to be destroyed
Hello support team,
after applying saved component state, I use the
Ext JS 7.1.0.46 / Ext.NET 5.1.0
Kind regards,
Dan
after applying saved component state, I use the
reconfigure
method to restore the original grid configuration. However, after this step, rendering of the cell editor crashes on the missing field
definition. In the following code, the editor for the first column is activated until the Reset Layout button is clicked:@using Ext.Net;
@using Ext.Net.MVC;
@{
Layout = null;
var X = Html.X();
var Model = new object[]
{
new object[] { "Alcoa Inc", 29.01, 0.42, 1.47, "9/1 12:00am" },
new object[] { "Altria Group Inc", 83.81, 0.28, 0.34, "9/1 12:00am" },
new object[] { "Boeing Co.", 75.43, 0.53, 0.71, "9/1 12:00am" },
new object[] { "Wal-Mart Stores, Inc.", 45.45, 0.73, 1.63, "9/1 12:00am" }
};
}
<!DOCTYPE html>
<html>
<head>
<title>Ext.NET MVC Test Case: Stateful Grid Cell Editing</title>
<script type="text/javascript">
var resetLayout = function (grid) {
grid.reconfigure(grid.getStore(), grid.initialConfig.columns.items);
}
</script>
</head>
<body>
@(X.ResourceManager())
@X.DisplayField().ID("version").ReadOnly(true).Margin(10).Width(200)
@(X.Window().ID("window").Layout(LayoutType.Fit).Width(650).Height(325).X(50).Y(50)
.Items(
X.FormPanel().Border(false).BodyPadding(10)
.LayoutConfig(new VBoxLayoutConfig { Align = VBoxAlign.Stretch })
.Items(
X.GridPanel()
.Margin(10)
.HeightSpec("100%")
.TopBar(X.Toolbar()
.Items(
X.Button().ID("btnReset").Text("Reset Layout").Icon(Icon.ArrowRotateAnticlockwise).OnClientClick("resetLayout(this.up('grid'))")
)
)
.Store(X.Store()
.Model(X.Model()
.Fields(
new ModelField("company"),
new ModelField("price", ModelFieldType.Float),
new ModelField("change", ModelFieldType.Float),
new ModelField("pctChange", ModelFieldType.Float),
new ModelField("lastChange", ModelFieldType.Date, "M/d hh:mmtt")
)
)
.DataSource(Model)
)
.ColumnModel(
X.Column().Text("Company").DataIndex("company").Flex(1)
.Editor(
X.TextField().AllowBlank(false)
),
X.Column().Text("Price").DataIndex("price").Renderer(RendererFormat.UsMoney),
X.Column().Text("Change").DataIndex("change"),
X.Column().Text("Change").DataIndex("pctChange"),
X.DateColumn().Text("Last Updated").DataIndex("lastChange")
)
.Plugins(X.CellEditing().ClicksToEdit(2))
.Stateful(true)
)
)
)
</body>
</html>
<script type="text/javascript">
Ext.onReady(function () {
Ext.getCmp("version").setValue("Ext JS " + Ext.getVersion().version + " / " + "Ext.NET " + Ext.net.Version);
});
</script>
After reconfiguring the grid and activating the cell editor, an error occurs in getColumnField
method because field.field
is null:columnHeader.activeEditorId = field instanceof Ext.grid.CellEditor ? field.field.getItemId() : field.getItemId();
Can you please help me with the correct reinitialization of the component after reconfiguring the grid? Will this method destroy only the cell editors or are there other parts of the grid configuration that need to be properly restored? Maybe I need to perform more steps than just rebuild cell editors.Ext JS 7.1.0.46 / Ext.NET 5.1.0
Kind regards,
Dan
Last edited by fabricio.murta; Jan 14, 2022 at 10:17 PM.