What's New?

[CLOSED] Grouping summary

  1. #1
    Dec 23, 2009, 9:54 AM

    [CLOSED] Grouping summary

    hi,

    i need a checkbox every grouping header row in gridpanel , and if i check grouping header checkbox , it should be checks all the checkbox on that particular group.

    i am trying to add checkbox in grouping summary, its added all the rows except grouping header row...

    please solve my problem...

    <%@ Page Language="C#" %>


<%@ Import Namespace="System.Globalization"%></p>


<%@ Import Namespace="System.Collections.Generic" %></p>


<%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %></p>


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" </p>


"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"></p>


<script runat="server"></p>


protected void Page_Load(object sender, EventArgs e)</p>


{</p>


CultureInfo ci = new CultureInfo("en-US");</p>


this.Store1.DataSource = new List<Project> </p>


{ </p>


new Project(100, "Ext Forms: Field Anchoring", 112, "Integrate 2.0 Forms with 2.0 Layouts", 6, 150, 0, DateTime.Parse("06/24/2007",ci)),</p>


new Project(100, "Ext Forms: Field Anchoring", 113, "Implement AnchorLayout", 4, 150, 0, DateTime.Parse("06/25/2007",ci)),</p>


new Project(100, "Ext Forms: Field Anchoring", 114, "Add support for multiple types of anchors", 4, 150, 0, DateTime.Parse("06/27/2007",ci)),</p>


new Project(100, "Ext Forms: Field Anchoring", 115, "Testing and debugging", 8, 0, 0, DateTime.Parse("06/29/2007",ci)),</p>


new Project(101, "Ext Grid: Single-level Grouping", 101, "Add required rendering \"hooks\" to GridView", 6, 100, 0, DateTime.Parse("07/01/2007",ci)),</p>


new Project(101, "Ext Grid: Single-level Grouping", 102, "Extend GridView and override rendering functions", 6, 100, 0, DateTime.Parse("07/03/2007",ci)),</p>


new Project(101, "Ext Grid: Single-level Grouping", 103, "Extend Store with grouping functionality", 4, 100, 0, DateTime.Parse("07/04/2007",ci)),</p>


new Project(101, "Ext Grid: Single-level Grouping", 121, "Default CSS Styling", 2, 100, 0, DateTime.Parse("07/05/2007",ci)),</p>


new Project(101, "Ext Grid: Single-level Grouping", 104, "Testing and debugging", 6, 100, 0, DateTime.Parse("07/06/2007",ci)),</p>


new Project(102, "Ext Grid: Summary Rows", 105, "Ext Grid plugin integration", 4, 125, 0, DateTime.Parse("07/01/2007",ci)),</p>


new Project(102, "Ext Grid: Summary Rows", 106, "Summary creation during rendering phase", 4, 125, 0, DateTime.Parse("07/02/2007",ci)),</p>


new Project(102, "Ext Grid: Summary Rows", 107, "Dynamic summary updates in editor grids", 6, 125, 0, DateTime.Parse("07/05/2007",ci)),</p>


new Project(102, "Ext Grid: Summary Rows", 108, "Remote summary integration", 4, 125, 0, DateTime.Parse("07/05/2007",ci)),</p>


new Project(102, "Ext Grid: Summary Rows", 109, "Summary renderers and calculators", 4, 125, 0, DateTime.Parse("07/06/2007",ci)),</p>


new Project(102, "Ext Grid: Summary Rows", 110, "Integrate summaries with GroupingView", 10, 125, 0, DateTime.Parse("07/11/2007",ci)),</p>


new Project(102, "Ext Grid: Summary Rows", 111, "Testing and debugging", 8, 125, 0, DateTime.Parse("07/15/2007",ci))</p>


};</p>


this.Store1.DataBind();</p>


}</p>


public class Project</p>


{</p>


public Project(int projectId, string name, int taskId, string description, int estimate, double rate, double cost, DateTime due)</p>


{</p>


this.ProjectID = projectId;</p>


this.Name = name;</p>


this.TaskID = taskId;</p>


this.Description = description;</p>


this.Estimate = estimate;</p>


this.Rate = rate;</p>


this.Due = due;</p>


}</p>


public int ProjectID { get; set; }</p>


public string Name { get;set; }</p>


public int TaskID { get; set; }</p>


public string Description { get;set; }</p>


public int Estimate { get;set; }</p>


public double Rate { get; set; }</p>


public double Cost { get; set; }</p>


public DateTime Due { get; set; }</p>


}</p>


</script></p>


<html xmlns="http://www.w3.org/1999/xhtml"></p>


<head id="Head1" runat="server"></p>


<title>Coolite Toolkit Example - GroupingSummary Plugin</title></p>


</p>


<link href="../../../../resources/css/examples.css" rel="stylesheet" type="text/css" /></p>


</p>


<style type="text/css"></p>


.x-grid3-body .x-grid3-td-Cost {</p>


background-color:#f1f2f4;</p>


}</p>


</p>


.x-grid3-summary-row .x-grid3-td-Cost {</p>


background-color:#e1e2e4;</p>


}</p>


</p>


.x-grid3-dirty-cell {</p>


background-image:none;</p>


}</p>


</p>


.x-grid3-summary-row {</p>


background:#F1F2F4 none repeat scroll 0 0;</p>


border-left:1px solid #FFFFFF;</p>


border-right:1px solid #FFFFFF;</p>


color:#333333;</p>


}</p>


</p>


.x-grid3-summary-row .x-grid3-cell-inner {</p>


font-weight:bold;</p>


padding-bottom:4px;</p>


}</p>


</p>


.x-grid3-cell-first .x-grid3-cell-inner {</p>


padding-left:16px;</p>


}</p>


</p>


.x-grid-hide-summary .x-grid3-summary-row {</p>


display:none;</p>


}</p>


</p>


.x-grid3-summary-msg {</p>


font-weight:bold;</p>


padding:4px 16px;</p>


} </p>


</style></p>


</head></p>


<body></p>


<form id="form1" runat="server"></p>


<h1>Group Summary Plugin</h1></p>


<ext:ScriptManager ID="ScriptManager1" runat="server"></p>


<Listeners></p>


<DocumentReady Handler="Ext.grid.GroupSummary.Calculations['totalCost'] = function(v, record, field){</p>


return v + (record.data.Estimate * record.data.Rate);</p>


}" /></p>


</Listeners></p>


</ext:ScriptManager></p>


</p>


<ext:Store ID="Store1" runat="server" GroupField="Name"></p>


<SortInfo Direction="ASC" Field="Due" /></p>


<Reader></p>


<ext:JsonReader ReaderID="TaskID"></p>


<Fields></p>


<ext:RecordField Name="ProjectID" /></p>


<ext:RecordField Name="Name" /></p>


<ext:RecordField Name="TaskID" /></p>


<ext:RecordField Name="Description" /></p>


<ext:RecordField Name="Estimate" /></p>


<ext:RecordField Name="Rate" /></p>


<ext:RecordField Name="Due" Type="Date" /></p>


</Fields></p>


</ext:JsonReader></p>


</Reader></p>


</ext:Store></p>


</p>


<ext:GridPanel </p>


ID="GridPanel1" </p>


runat="server" </p>


Frame="true"</p>


StoreID="Store1"</p>


StripeRows="true"</p>


Title="Sponsored Projects"</p>


AutoExpandColumn="Description" </p>


Collapsible="true"</p>


AnimCollapse="false"</p>


Icon="ApplicationViewColumns"</p>


TrackMouseOver="false"</p>


Width="800"</p>


Height="450"</p>


ClicksToEdit="1"></p>


<ColumnModel ID="ColumnModel1" runat="server"></p>


<Columns></p>


<ext:GroupingSummaryColumn </p>


ColumnID="Description" </p>


Header="Task" </p>


Sortable="true" </p>


DataIndex="Description" </p>


Hideable="false"</p>


SummaryType="Count"></p>


<SummaryRenderer Handler="return ((value === 0 || value > 1) ? '(' + value +' Tasks)' : '(1 Task)');" /> </p>


</ext:GroupingSummaryColumn></p>


</p>


<ext:Column ColumnID="Name" Header="Project" Sortable="true" DataIndex="Name" Width="20" /></p>


</p>


<ext:GroupingSummaryColumn </p>


ColumnID="Due" </p>


Width="25"</p>


Header="Due Date" </p>


Sortable="true" </p>


DataIndex="Due"</p>


SummaryType="Max"></p>


<Renderer Format="Date" FormatArgs="'m/d/Y'" /></p>


</ext:GroupingSummaryColumn></p>


<ext:GroupingSummaryColumn </p>


Width="20"</p>


ColumnID="Estimate" </p>


Header="Estimate" </p>


Sortable="true" </p>


DataIndex="Estimate" </p>


SummaryType="Max"></p>


<Renderer Handler="return value +' hours';" /> </p>


</ext:GroupingSummaryColumn></p>


</p>


<ext:GroupingSummaryColumn </p>


Width="20"</p>


ColumnID="Rate" </p>


Header="Rate" </p>


Sortable="true" </p>


DataIndex="Rate"</p>


SummaryType="Average"></p>


<Renderer Format="UsMoney" /></p>


</ext:GroupingSummaryColumn></p>


</p>


<ext:GroupingSummaryColumn </p>


Width="20"</p>


ColumnID="Cost" </p>


Header="Cost" </p>


Sortable="false"</p>


Groupable="false" </p>


DataIndex="Cost"</p>


CustomSummaryType="totalCost"></p>


<Renderer Handler="return Ext.util.Format.usMoney(record.data.Estimate * record.data.Rate);" /></p>


<SummaryRenderer Format="UsMoney" /></p>


</ext:GroupingSummaryColumn></p>


</Columns></p>


</ColumnModel></p>


<SelectionModel></p>


<ext:CheckboxSelectionModel ID="CheckboxSelectionModel1" runat="server"></p>


<CustomConfig></p>


<ext:ConfigItem Name="checkOnly" Value="true" Mode="Raw" /></p>


</CustomConfig></p>


</ext:CheckboxSelectionModel></p>


</SelectionModel></p>


<View></p>


<ext:GroupingView </p>


ID="GroupingView1" </p>


runat="server" </p>


ForceFit="true"</p>


ShowGroupName="false"</p>


EnableNoGroups="true"</p>


HideGroupedColumn="true"</p>


/></p>


</View> </p>


<Plugins></p>


<ext:GroupingSummary ID="GroupingSummary1" runat="server" /></p>


</Plugins> </p>


</ext:GridPanel></p>


</form></p>


</body></p>


</html>
    </p>
  2. #2
    Dec 23, 2009, 1:33 PM

    RE: [CLOSED] Grouping summary

    Hi,

    The group row cannot contains checkbox. I can suggest to use GroupCommand button. Please see the following sample
    <%@ Page Language="C#" %>

<%@ Import Namespace="System.Globalization" %>
<%@ Import Namespace="System.Collections.Generic" %>
<%@ 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">
    protected void Page_Load(object sender, EventArgs e)
    {
        CultureInfo ci = new CultureInfo("en-US");
        this.Store1.DataSource = new List<Project> 
        { 
            new Project(100, "Ext Forms: Field Anchoring", 112, "Integrate 2.0 Forms with 2.0 Layouts", 6, 150, 0, DateTime.Parse("06/24/2007",ci)),
            new Project(100, "Ext Forms: Field Anchoring", 113, "Implement AnchorLayout", 4, 150, 0, DateTime.Parse("06/25/2007",ci)),
            new Project(100, "Ext Forms: Field Anchoring", 114, "Add support for multiple types of anchors", 4, 150, 0, DateTime.Parse("06/27/2007",ci)),
            new Project(100, "Ext Forms: Field Anchoring", 115, "Testing and debugging", 8, 0, 0, DateTime.Parse("06/29/2007",ci)),
            new Project(101, "Ext Grid: Single-level Grouping", 101, "Add required rendering \"hooks\" to GridView", 6, 100, 0, DateTime.Parse("07/01/2007",ci)),
            new Project(101, "Ext Grid: Single-level Grouping", 102, "Extend GridView and override rendering functions", 6, 100, 0, DateTime.Parse("07/03/2007",ci)),
            new Project(101, "Ext Grid: Single-level Grouping", 103, "Extend Store with grouping functionality", 4, 100, 0, DateTime.Parse("07/04/2007",ci)),
            new Project(101, "Ext Grid: Single-level Grouping", 121, "Default CSS Styling", 2, 100, 0, DateTime.Parse("07/05/2007",ci)),
            new Project(101, "Ext Grid: Single-level Grouping", 104, "Testing and debugging", 6, 100, 0, DateTime.Parse("07/06/2007",ci)),
            new Project(102, "Ext Grid: Summary Rows", 105, "Ext Grid plugin integration", 4, 125, 0, DateTime.Parse("07/01/2007",ci)),
            new Project(102, "Ext Grid: Summary Rows", 106, "Summary creation during rendering phase", 4, 125, 0, DateTime.Parse("07/02/2007",ci)),
            new Project(102, "Ext Grid: Summary Rows", 107, "Dynamic summary updates in editor grids", 6, 125, 0, DateTime.Parse("07/05/2007",ci)),
            new Project(102, "Ext Grid: Summary Rows", 108, "Remote summary integration", 4, 125, 0, DateTime.Parse("07/05/2007",ci)),
            new Project(102, "Ext Grid: Summary Rows", 109, "Summary renderers and calculators", 4, 125, 0, DateTime.Parse("07/06/2007",ci)),
            new Project(102, "Ext Grid: Summary Rows", 110, "Integrate summaries with GroupingView", 10, 125, 0, DateTime.Parse("07/11/2007",ci)),
            new Project(102, "Ext Grid: Summary Rows", 111, "Testing and debugging", 8, 125, 0, DateTime.Parse("07/15/2007",ci))
        };

        this.Store1.DataBind();
    }


    public class Project
    {
        public Project(int projectId, string name, int taskId, string description, int estimate, double rate, double cost, DateTime due)
        {
            this.ProjectID = projectId;
            this.Name = name;
            this.TaskID = taskId;
            this.Description = description;
            this.Estimate = estimate;
            this.Rate = rate;
            this.Due = due;
        }

        public int ProjectID { get; set; }
        public string Name { get; set; }
        public int TaskID { get; set; }
        public string Description { get; set; }
        public int Estimate { get; set; }
        public double Rate { get; set; }
        public double Cost { get; set; }
        public DateTime Due { get; set; }
    }
</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>Coolite Toolkit Example - GroupingSummary Plugin</title>
    <link href="../../../../resources/css/examples.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
        .x-grid3-body .x-grid3-td-Cost
        {
            background-color: #f1f2f4;
        }
        .x-grid3-summary-row .x-grid3-td-Cost
        {
            background-color: #e1e2e4;
        }
        .x-grid3-dirty-cell
        {
            background-image: none;
        }
        .x-grid3-summary-row
        {
            background: #F1F2F4 none repeat scroll 0 0;
            border-left: 1px solid #FFFFFF;
            border-right: 1px solid #FFFFFF;
            color: #333333;
        }
        .x-grid3-summary-row .x-grid3-cell-inner
        {
            font-weight: bold;
            padding-bottom: 4px;
        }
        .x-grid3-cell-first .x-grid3-cell-inner
        {
            padding-left: 16px;
        }
        .x-grid-hide-summary .x-grid3-summary-row
        {
            display: none;
        }
        .x-grid3-summary-msg
        {
            font-weight: bold;
            padding: 4px 16px;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <h1>
        Group Summary Plugin</h1>
    <ext:ScriptManager ID="ScriptManager1" runat="server">
        <Listeners>
            <DocumentReady Handler="Ext.grid.GroupSummary.Calculations['totalCost'] = function(v, record, field){


return v + (record.data.Estimate * record.data.Rate);


}" />
        </Listeners>
    </ext:ScriptManager>
    <ext:Store ID="Store1" runat="server" GroupField="Name">
        <SortInfo Direction="ASC" Field="Due" />
        <Reader>
            <ext:JsonReader ReaderID="TaskID">
                <Fields>
                    <ext:RecordField Name="ProjectID" />
                    <ext:RecordField Name="Name" />
                    <ext:RecordField Name="TaskID" />
                    <ext:RecordField Name="Description" />
                    <ext:RecordField Name="Estimate" />
                    <ext:RecordField Name="Rate" />
                    <ext:RecordField Name="Due" Type="Date" />
                </Fields>
            </ext:JsonReader>
        </Reader>
    </ext:Store>
    <ext:GridPanel ID="GridPanel1" runat="server" Frame="true" StoreID="Store1" StripeRows="true"
        Title="Sponsored Projects" AutoExpandColumn="Description" Collapsible="true"
        AnimCollapse="false" Icon="ApplicationViewColumns" TrackMouseOver="false" Width="800"
        Height="450" ClicksToEdit="1">
        <ColumnModel ID="ColumnModel1" runat="server">
            <Columns>
                <ext:GroupingSummaryColumn ColumnID="Description" Header="Task" Sortable="true" DataIndex="Description"
                    Hideable="false" SummaryType="Count">
                    <SummaryRenderer Handler="return ((value === 0 || value > 1) ? '(' + value +' Tasks)' : '(1 Task)');" />
                </ext:GroupingSummaryColumn>
                <ext:Column ColumnID="Name" Header="Project" Sortable="true" DataIndex="Name" Width="20" />
                <ext:GroupingSummaryColumn ColumnID="Due" Width="25" Header="Due Date" Sortable="true"
                    DataIndex="Due" SummaryType="Max">
                    <Renderer Format="Date" FormatArgs="'m/d/Y'" />
                </ext:GroupingSummaryColumn>
                <ext:GroupingSummaryColumn Width="20" ColumnID="Estimate" Header="Estimate" Sortable="true"
                    DataIndex="Estimate" SummaryType="Max">
                    <Renderer Handler="return value +' hours';" />
                </ext:GroupingSummaryColumn>
                <ext:GroupingSummaryColumn Width="20" ColumnID="Rate" Header="Rate" Sortable="true"
                    DataIndex="Rate" SummaryType="Average">
                    <Renderer Format="UsMoney" />
                </ext:GroupingSummaryColumn>
                <ext:GroupingSummaryColumn Width="20" ColumnID="Cost" Header="Cost" Sortable="false"
                    Groupable="false" DataIndex="Cost" CustomSummaryType="totalCost">
                    <Renderer Handler="return Ext.util.Format.usMoney(record.data.Estimate * record.data.Rate);" />
                    <SummaryRenderer Format="UsMoney" />
                </ext:GroupingSummaryColumn>
                <ext:CommandColumn>
                    <GroupCommands>
                        <ext:CommandFill />
                        <ext:GridCommand Text="Select Group" CommandName="gSelect" />
                    </GroupCommands>
                </ext:CommandColumn>
            </Columns>
        </ColumnModel>
        <SelectionModel>
            <ext:CheckboxSelectionModel ID="CheckboxSelectionModel1" runat="server">
                <CustomConfig>
                    <ext:ConfigItem Name="checkOnly" Value="true" Mode="Raw" />
                </CustomConfig>
            </ext:CheckboxSelectionModel>
        </SelectionModel>
        <View>
            <ext:GroupingView ID="GroupingView1" runat="server" ForceFit="true" ShowGroupName="false"
                EnableNoGroups="true" HideGroupedColumn="true" />
        </View>
        <Plugins>
            <ext:GroupingSummary ID="GroupingSummary1" runat="server" />
        </Plugins>
        
        <Listeners>
            <GroupCommand Handler="if(command == 'gSelect'){this.getSelectionModel().selectRecords(records, true);this.view.toggleGroup(this.getGridEl().id + '-gp-' + groupId);}" />
        </Listeners>
    </ext:GridPanel>
    </form>
</body>
</html>

Similar Threads

  1. [CLOSED] Grouping Summary
    By majestic in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Aug 18, 2011, 6:42 AM
  2. [CLOSED] Show summary in the grouping
    By Raynald_Fontaine in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Apr 30, 2010, 5:04 PM
  3. [CLOSED] Remote grouping or grouping summary for GridPanel
    By jchau in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Nov 08, 2009, 10:23 PM
  4. [CLOSED] Paging and the Grouping Summary
    By mjessup in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: May 05, 2009, 11:13 AM
  5. Summary Row Without Grouping
    By Tbaseflug in forum 1.x Help
    Replies: 0
    Last Post: Apr 27, 2009, 2:59 PM

Posting Permissions