May 21, 2009, 12:45 PM
[CLOSED] Adding grouping summary columns in AjaxEvent
Hi,
Is it possible to add GroupingSummaryColumn to a grid in an AjaxEvent? In the code below, when I click 'Load Set2' button and then try to group by the 'String' column, I receive JavaScript error.
Regards,
Tadeusz
Is it possible to add GroupingSummaryColumn to a grid in an AjaxEvent? In the code below, when I click 'Load Set2' button and then try to group by the 'String' column, I receive JavaScript error.
<%@ Page Language="C#" %>
<%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
private void AddField( RecordField field )
{
if ( Ext.IsAjaxRequest )
{
this.Store1.AddField( field );
}
else
{
this.Store1.Reader.Reader.Fields.Add( field );
}
}
private void BindSet1()
{
string now = DateTime.Now.TimeOfDay.ToString();
this.Store1.DataSource = new object[]
{
new object[] {"Set1_1", 1, now},
new object[] {"Set1_2", 2, now},
new object[] {"Set1_3", 3, now}
};
this.Store1.DataBind();
}
private void BuildSet1()
{
if ( Ext.IsAjaxRequest )
{
this.Store1.RemoveFields();
}
this.AddField( new RecordField( "StringField" ) );
this.AddField( new RecordField( "IntField", RecordFieldType.Int ) );
this.AddField( new RecordField( "Timestamp" ) );
this.BindSet1();
this.GridPanel1.ColumnModel.Columns.Add( new Column { DataIndex = "StringField", Header = "String" } );
this.GridPanel1.ColumnModel.Columns.Add( new GroupingSummaryColumn { DataIndex = "IntField", Header = "Int", SummaryType = SummaryType.Sum } );
this.GridPanel1.ColumnModel.Columns.Add( new Column { DataIndex = "Timestamp", Header = "Timestamp" } );
if ( Ext.IsAjaxRequest )
{
this.GridPanel1.Reconfigure();
}
}
private void BindSet2()
{
string now = DateTime.Now.TimeOfDay.ToString();
this.Store1.DataSource = new object[]
{
new object[] {1, "Set2_1", 1, now},
new object[] {2, "Set2_2", 2, now},
new object[] {3, "Set2_3", 3, now},
new object[] {4, "Set2_4", 4, now},
new object[] {5, "Set2_5", 5, now},
new object[] {6, "Set2_6", 6, now}
};
this.Store1.DataBind();
}
private void BuildSet2()
{
if ( Ext.IsAjaxRequest )
{
this.Store1.RemoveFields();
}
this.AddField( new RecordField( "IntField1", RecordFieldType.Int ) );
this.AddField( new RecordField( "StringField" ) );
this.AddField( new RecordField( "IntField2", RecordFieldType.Int ) );
this.AddField( new RecordField( "Timestamp" ) );
this.BindSet2();
this.GridPanel1.ColumnModel.Columns.Add( new Column { DataIndex = "IntField1", Header = "Int1" } );
this.GridPanel1.ColumnModel.Columns.Add( new Column { DataIndex = "StringField", Header = "String" } );
this.GridPanel1.ColumnModel.Columns.Add( new GroupingSummaryColumn { DataIndex = "IntField2", Header = "Int2", SummaryType = SummaryType.Sum } );
this.GridPanel1.ColumnModel.Columns.Add( new Column { DataIndex = "Timestamp", Header = "Timestamp" } );
if ( Ext.IsAjaxRequest )
{
this.GridPanel1.Reconfigure();
}
}
private void RefreshSet()
{
switch ( CurrentSet.Text )
{
case "1":
this.BindSet1();
break;
case "2":
this.BindSet2();
break;
}
}
protected void Page_Load( object sender, EventArgs e )
{
if ( !Ext.IsAjaxRequest )
{
this.BuildSet1();
}
}
protected void RefreshDataSet( object sender, StoreRefreshDataEventArgs e )
{
switch ( e.Parameters["set"] )
{
case "1":
this.BuildSet1();
CurrentSet.Text = "1";
break;
case "2":
this.BuildSet2();
CurrentSet.Text = "2";
break;
default:
this.RefreshSet();
break;
}
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<ext:ScriptManager ID="ScriptManager1" runat="server" />
<ext:Store ID="Store1" runat="server" OnRefreshData="RefreshDataSet" IgnoreExtraFields="false">
<Reader>
<ext:ArrayReader>
</ext:ArrayReader>
</Reader>
</ext:Store>
<ext:GridPanel ID="GridPanel1" runat="server" StoreID="Store1" Title="Grid" Width="600" Height="350">
<SelectionModel>
<ext:RowSelectionModel ID="RowSelectionModel1" runat="server" SingleSelect="true" />
</SelectionModel>
<View>
<ext:GroupingView ID="GroupingView1" HideGroupedColumn="true" runat="server" ForceFit="true" StartCollapsed="false" GroupTextTpl="{text}" EnableRowBody="true">
</ext:GroupingView>
</View>
<Buttons>
<ext:Button ID="Button1" runat="server" Text="Load Set1" EnableToggle="true" ToggleGroup="set" Pressed="true">
<Listeners>
<Click Handler="#{GridPanel1}.store.reload({params:{set:1}});" />
</Listeners>
</ext:Button>
<ext:Button ID="Button2" runat="server" Text="Load Set2" EnableToggle="true" ToggleGroup="set">
<Listeners>
<Click Handler="#{GridPanel1}.store.reload({params:{set:2}});" />
</Listeners>
</ext:Button>
<ext:Button ID="Button3" runat="server" Text="Refresh current set">
<Listeners>
<Click Handler="#{GridPanel1}.store.reload();" />
</Listeners>
</ext:Button>
</Buttons>
<Plugins>
<ext:GroupingSummary ID="GroupingSummary1" runat="server">
</ext:GroupingSummary>
</Plugins>
</ext:GridPanel>
<ext:Hidden ID="CurrentSet" runat="server" Text="1">
</ext:Hidden>
</form>
</body>
</html>Regards,
Tadeusz
