Problem with dynamic grids and record parameter in column renderer
Hello!
I am using a grid with dynamic columns and a custom column render. If the column names change with each render, the "record" parameter received by the renderer has all the fields the grid has had instead of only the current ones. Here is an example:
Code:
<%@ Page Language="C#" %>
<%@ Import Namespace="System.Data" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ext:ResourcePlaceHolder ID="ResourcePlaceHolder1" runat="server" Mode="ScriptFiles" />
<script type="text/javascript">
Ext.net.GridPanel.prototype.doSelection = Ext.net.GridPanel.prototype.doSelection.createInterceptor(function () {
this.getSelectionModel();
});
function MyRenderer(value, metadata, record, rowIndex, colIndex, store) {
return record.fields.length;
}
</script>
<script runat="server">
Random rnd = new Random();
[DirectMethod]
public void Prepare_Click(object sender, DirectEventArgs e)
{
PrepareGrid(myGrid);
}
private void PrepareGrid(GridPanel grid)
{
// Add columns to grid.
var columns = new string[] { "Text1_" + rnd.Next(9), "Num1_" + rnd.Next(9), "Text2_" + rnd.Next(9), "Num2_" + rnd.Next(9), "Comments" };
foreach (string col in columns)
{
Column newCol = new Column { Header = col, DataIndex = col, Width = 120, MenuDisabled = true, Sortable = false };
grid.ColumnModel.Columns.Add(newCol);
}
grid.Controls.RemoveAt(0);
grid.Render();
// Add records to store reader.
RecordField newRecord1 = new RecordField(columns[0], RecordFieldType.String);
RecordField newRecord2 = new RecordField(columns[1], RecordFieldType.Int);
RecordField newRecord3 = new RecordField(columns[2], RecordFieldType.String);
RecordField newRecord4 = new RecordField(columns[3], RecordFieldType.Int);
this.strDemo.AddField(newRecord1);
this.strDemo.AddField(newRecord2);
this.strDemo.AddField(newRecord3);
this.strDemo.AddField(newRecord4);
// Create data table
DataTable data = new DataTable();
data.Columns.Add("Date", typeof(DateTime));
data.Columns.Add(columns[0], typeof(string));
data.Columns.Add(columns[1], typeof(int));
data.Columns.Add(columns[2], typeof(string));
data.Columns.Add(columns[3], typeof(int));
data.Columns.Add("Comments", typeof(string));
data.Rows.Add(DateTime.Now, "Line 1 " + rnd.Next(9), 10, "Some text " + rnd.Next(9), 20, "Correct");
data.Rows.Add(DateTime.Now.AddDays(1).AddHours(1), "Line 2 " + rnd.Next(9), 15, "More text " + rnd.Next(9), 25, "Wrong");
this.strDemo.DataSource = data;
this.strDemo.DataBind();
}
</script>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>Dynamic Grid - Record Fields Problem</title>
</head>
<body>
<form id="Form1" runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server" />
<ext:Store ID="strDemo" runat="server">
<Reader>
<ext:JsonReader IDProperty="Date">
<Fields>
<ext:RecordField Name="Date" Type="Date" />
<ext:RecordField Name="Comments" Type="String" />
</Fields>
</ext:JsonReader>
</Reader>
</ext:Store>
<ext:Viewport ID="Viewport1" runat="server" Layout="border">
<Items>
<ext:Panel runat="server" Region="West" Width="100">
<Items>
<ext:Button runat="server" ID="btnPrepare" Text="Load">
<DirectEvents>
<Click OnEvent="Prepare_Click" />
</DirectEvents>
</ext:Button>
</Items>
</ext:Panel>
<ext:Panel runat="server" Region="Center">
<Items>
<ext:GridPanel ID="myGrid" runat="server" StoreID="strDemo" AutoHeight="true" EnableColumnMove="false" EnableColumnResize="false">
<ColumnModel ID="ColumnModel1" runat="server">
<Columns>
<ext:Column Header="Field Count">
<Renderer Fn="MyRenderer" />
</ext:Column>
<ext:DateColumn Header="Day" DataIndex="Date" Format="MM/dd/yyyy" MenuDisabled="true" Sortable="false" />
<ext:DateColumn Header="Time" DataIndex="Date" Format="HH:mm:ss" MenuDisabled="true" Sortable="false" />
</Columns>
</ColumnModel>
<View>
<ext:GridView />
</View>
</ext:GridPanel>
</Items>
</ext:Panel>
</Items>
</ext:Viewport>
</form>
</body>
</html>
Each time you press Load, new random column names are rendered and new data is loaded, but in record.fields (as well as store.fields) all previous dynamic fields are still present. This is shown in the "Field Count" column, which has the renderer. The main problem is then that the colIndex parameter, which corresponds to the actual column model, doesn't match with this list of fields and I can't know what column it's actually rendering.
Summarizing, the datasource table, the store and the column model all have the appropriate columns, but the fields in the record and the store parameters sent to the renderer keep the old ones.
Am I missing clearing something? I couldn't find anything wrong from the code behind.
Is there a way to prevent this? It happens with all 1.x versions I have tested.
Thanks and regards,
Andrew
