[CLOSED] Spans not allowed in grid headers (when grouped)

  1. #1

    [CLOSED] Spans not allowed in grid headers (when grouped)

    Two issues

    1. spans are no longer allowed in grouping header templates
    this works
      GroupHeaderTplString="{name}"
    this does NOT work
     GroupHeaderTplString='<span style="color:white">({[values.rows.length]} {[values.rows.length > 1 ? "Test" : "Test"]})</span>'
    2. grouping headers background colors are not able to be set the same way. Maybe there is another level of spans/divs so the css path is wrong?

    Both are breaking changes from v3 to v4 and can be seen in the following example.

    <%@ Page Language="C#" %>
    
    
    <%@ Import Namespace="System.Collections.Generic" %>
    
    
    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
         {
             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, new DateTime(2007, 06, 24)),
                new Project(100, "Ext Forms: Field Anchoring", 113, "Implement AnchorLayout", 4, 150, 0, new DateTime(2007, 06, 25)),
                new Project(100, "Ext Forms: Field Anchoring", 114, "Add support for multiple types of anchors", 4, 150, 0, new DateTime(2007, 06, 27)),
                new Project(100, "Ext Forms: Field Anchoring", 115, "Testing and debugging", 8, 0, 0, new DateTime(2007, 06, 29)),
                new Project(101, "Ext Grid: Single-level Grouping", 101, "Add required rendering \"hooks\" to GridView", 6, 100, 0, new DateTime(2007, 07, 01)),
                new Project(101, "Ext Grid: Single-level Grouping", 102, "Extend GridView and override rendering functions", 6, 100, 0, new DateTime(2007, 07, 03)),
                new Project(101, "Ext Grid: Single-level Grouping", 103, "Extend Store with grouping functionality", 4, 100, 0, new DateTime(2007, 07, 04)),
                new Project(101, "Ext Grid: Single-level Grouping", 121, "Default CSS Styling", 2, 100, 0, new DateTime(2007, 07, 05)),
                new Project(101, "Ext Grid: Single-level Grouping", 104, "Testing and debugging", 6, 100, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 1015, "Ext Grid plugin integration", 4, 125, 0, new DateTime(2007, 07, 01)),
                new Project(102, "Ext Grid: Summary Rows", 1026, "Summary creation during rendering phase", 4, 125, 0, new DateTime(2007, 07, 02)),
                new Project(102, "Ext Grid: Summary Rows", 10237, "Dynamic summary updates in editor grids", 6, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 1083, "Remote summary integration", 4, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 1094, "Summary renderers and calculators", 4, 125, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 1105, "Integrate summaries with GroupingView", 10, 125, 0, new DateTime(2007, 07, 11)),
                new Project(100, "Ext Forms: Field Anchoring", 5113, "Implement AnchorLayout", 4, 150, 0, new DateTime(2007, 06, 25)),
                new Project(100, "Ext Forms: Field Anchoring", 1614, "Add support for multiple types of anchors", 4, 150, 0, new DateTime(2007, 06, 27)),
                new Project(100, "Ext Forms: Field Anchoring", 1165, "Testing and debugging", 8, 0, 0, new DateTime(2007, 06, 29)),
                new Project(101, "Ext Grid: Single-level Grouping", 8101, "Add required rendering \"hooks\" to GridView", 6, 100, 0, new DateTime(2007, 07, 01)),
                new Project(101, "Ext Grid: Single-level Grouping", 1802, "Extend GridView and override rendering functions", 6, 100, 0, new DateTime(2007, 07, 03)),
                new Project(101, "Ext Grid: Single-level Grouping", 1903, "Extend Store with grouping functionality", 4, 100, 0, new DateTime(2007, 07, 04)),
                new Project(101, "Ext Grid: Single-level Grouping", 12401, "Default CSS Styling", 2, 100, 0, new DateTime(2007, 07, 05)),
                new Project(101, "Ext Grid: Single-level Grouping", 1034, "Testing and debugging", 6, 100, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 66105, "Ext Grid plugin integration", 4, 125, 0, new DateTime(2007, 07, 01)),
                new Project(102, "Ext Grid: Summary Rows", 16606, "Summary creation during rendering phase", 4, 125, 0, new DateTime(2007, 07, 02)),
                new Project(102, "Ext Grid: Summary Rows", 16607, "Dynamic summary updates in editor grids", 6, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 16608, "Remote summary integration", 4, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 10669, "Summary renderers and calculators", 4, 125, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 11660, "Integrate summaries with GroupingView", 10, 125, 0, new DateTime(2007, 07, 11)),
                new Project(100, "Ext Forms: Field Anchoring", 77113, "Implement AnchorLayout", 4, 150, 0, new DateTime(2007, 06, 25)),
                new Project(100, "Ext Forms: Field Anchoring", 1174, "Add support for multiple types of anchors", 4, 150, 0, new DateTime(2007, 06, 27)),
                new Project(100, "Ext Forms: Field Anchoring", 1185, "Testing and debugging", 8, 0, 0, new DateTime(2007, 06, 29)),
                new Project(101, "Ext Grid: Single-level Grouping", 19901, "Add required rendering \"hooks\" to GridView", 6, 100, 0, new DateTime(2007, 07, 01)),
                new Project(101, "Ext Grid: Single-level Grouping", 1092, "Extend GridView and override rendering functions", 6, 100, 0, new DateTime(2007, 07, 03)),
                new Project(101, "Ext Grid: Single-level Grouping", 1093, "Extend Store with grouping functionality", 4, 100, 0, new DateTime(2007, 07, 04)),
                new Project(101, "Ext Grid: Single-level Grouping", 1291, "Default CSS Styling", 2, 100, 0, new DateTime(2007, 07, 05)),
                new Project(101, "Ext Grid: Single-level Grouping", 1094, "Testing and debugging", 6, 100, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 1005, "Ext Grid plugin integration", 4, 125, 0, new DateTime(2007, 07, 01)),
                new Project(102, "Ext Grid: Summary Rows", 1006, "Summary creation during rendering phase", 4, 125, 0, new DateTime(2007, 07, 02)),
                new Project(102, "Ext Grid: Summary Rows", 1007, "Dynamic summary updates in editor grids", 6, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 1008, "Remote summary integration", 4, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 1009, "Summary renderers and calculators", 4, 125, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 1100, "Integrate summaries with GroupingView", 10, 125, 0, new DateTime(2007, 07, 11)),
                new Project(100, "Ext Forms: Field Anchoring", 09113, "Implement AnchorLayout", 4, 150, 0, new DateTime(2007, 06, 25)),
                new Project(100, "Ext Forms: Field Anchoring", 1914, "Add support for multiple types of anchors", 4, 150, 0, new DateTime(2007, 06, 27)),
                new Project(100, "Ext Forms: Field Anchoring", 1915, "Testing and debugging", 8, 0, 0, new DateTime(2007, 06, 29)),
                new Project(101, "Ext Grid: Single-level Groupin9g", 9101, "Add required rendering \"hooks\" to GridView", 6, 100, 0, new DateTime(2007, 07, 01)),
                new Project(101, "Ext Grid: Single-level Grouping", 1092, "Extend GridView and override rendering functions", 6, 100, 0, new DateTime(2007, 07, 03)),
                new Project(101, "Ext Grid: Single-level Grouping", 1093, "Extend Store with grouping functionality", 4, 100, 0, new DateTime(2007, 07, 04)),
                new Project(101, "Ext Grid: Single-level Grouping", 1921, "Default CSS Styling", 2, 100, 0, new DateTime(2007, 07, 05)),
                new Project(101, "Ext Grid: Single-level Grouping", 1904, "Testing and debugging", 6, 100, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 1095, "Ext 9Grid plugin integration", 4, 125, 0, new DateTime(2007, 07, 01)),
                new Project(102, "Ext Grid: Summary Rows", 106, "Summary creation during rendering phase", 4, 125, 0, new DateTime(2007, 07, 02)),
                new Project(102, "Ext Grid: Summary Rows", 107, "Dynamic summary updates in editor grids", 6, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 108, "Remote summary integration", 4, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 109, "Summary renderers and calculators", 4, 125, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 110, "Integrate summaries with GroupingView", 10, 125, 0, new DateTime(2007, 07, 11)),
                new Project(100, "Ext Forms: Field Anchoring", 113, "Implement AnchorLayout", 4, 150, 0, new DateTime(2007, 06, 25)),
                new Project(100, "Ext Forms: Field Anchoring", 114, "Add support for multiple types of anchors", 4, 150, 0, new DateTime(2007, 06, 27)),
                new Project(100, "Ext Forms: Field Anchoring", 115, "Testing and debugging", 8, 0, 0, new DateTime(2007, 06, 29)),
                new Project(101, "Ext Grid: Single-level Grouping", 101, "Add required rendering \"hooks\" to GridView", 6, 100, 0, new DateTime(2007, 07, 01)),
                new Project(101, "Ext Grid: Single-level Grouping", 102, "Extend GridView and override rendering functions", 6, 100, 0, new DateTime(2007, 07, 03)),
                new Project(101, "Ext Grid: Single-level Grouping", 103, "Extend Store with grouping functionality", 4, 100, 0, new DateTime(2007, 07, 04)),
                new Project(101, "Ext Grid: Single-level Grouping", 121, "Default CSS Styling", 2, 100, 0, new DateTime(2007, 07, 05)),
                new Project(101, "Ext Grid: Single-level Grouping", 104, "Testing and debugging", 6, 100, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 13305, "Ext Grid plugin integration", 4, 125, 0, new DateTime(2007, 07, 01)),
                new Project(102, "Ext Grid: Summary Rows", 10336, "Summary creation during rendering phase", 4, 125, 0, new DateTime(2007, 07, 02)),
                new Project(102, "Ext Grid: Summary Rows", 13307, "Dynamic summary updates in editor grids", 6, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 13308, "Remote summary integration", 4, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 10339, "Summary renderers and calculators", 4, 125, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 11330, "Integrate summaries with GroupingView", 10, 125, 0, new DateTime(2007, 07, 11)),
                new Project(100, "Ext Forms: Field Anchoring", 31313, "Implement AnchorLayout", 4, 150, 0, new DateTime(2007, 06, 25)),
                new Project(100, "Ext Forms: Field Anchoring", 13314, "Add support for multiple types of anchors", 4, 150, 0, new DateTime(2007, 06, 27)),
                new Project(100, "Ext Forms: Field Anchoring", 1315, "Testing and debugging", 8, 0, 0, new DateTime(2007, 06, 29)),
                new Project(101, "Ext Grid: Single-level Grouping", 4101, "Add required rendering \"hooks\" to GridView", 6, 100, 0, new DateTime(2007, 07, 01)),
                new Project(101, "Ext Grid: Single-level Grouping", 4102, "Extend GridView and override rendering functions", 6, 100, 0, new DateTime(2007, 07, 03)),
                new Project(101, "Ext Grid: Single-level Grouping", 4103, "Extend Store with grouping functionality", 4, 100, 0, new DateTime(2007, 07, 04)),
                new Project(101, "Ext Grid: Single-level Grouping", 4121, "Default CSS Styling", 2, 100, 0, new DateTime(2007, 07, 05)),
                new Project(101, "Ext Grid: Single-level Grouping", 4104, "Testing and debugging", 6, 100, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 1405, "Ext Grid plugin integration", 4, 125, 0, new DateTime(2007, 07, 01)),
                new Project(102, "Ext Grid: Summary Rows", 1406, "Summary creation during rendering phase", 4, 125, 0, new DateTime(2007, 07, 02)),
                new Project(102, "Ext Grid: Summary Rows", 1407, "Dynamic summary updates in editor grids", 6, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 108, "Remote summary integration", 4, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 1409, "Summary renderers and calculators", 4, 125, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 41410, "Integrate summaries with GroupingView", 10, 125, 0, new DateTime(2007, 07, 11)),
                new Project(100, "Ext Forms: Field Anchoring", 14143, "Implement AnchorLayout", 4, 150, 0, new DateTime(2007, 06, 25)),
                new Project(100, "Ext Forms: Field Anchoring", 114444, "Add support for multiple types of anchors", 4, 150, 0, new DateTime(2007, 06, 27)),
                new Project(100, "Ext Forms: Field Anchoring", 11544, "Testing and debugging", 8, 0, 0, new DateTime(2007, 06, 29)),
                new Project(101, "Ext Grid: Single-level Grouping4", 5101, "Add required rendering \"hooks\" to GridView", 6, 100, 0, new DateTime(2007, 07, 01)),
                new Project(101, "Ext Grid: Single-level Grouping", 5102, "Extend GridView and override rendering functions", 6, 100, 0, new DateTime(2007, 07, 03)),
                new Project(101, "Ext Grid: Single-level Grouping", 5103, "Extend Store with grouping functionality", 4, 100, 0, new DateTime(2007, 07, 04)),
                new Project(101, "Ext Grid: Single-level Grouping", 5121, "Default CSS Styling", 2, 100, 0, new DateTime(2007, 07, 05)),
                new Project(101, "Ext Grid: Single-level Grouping", 5104, "Testing and debugging", 6, 100, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 1605, "Ext Grid plugin integration", 4, 125, 0, new DateTime(2007, 07, 01)),
                new Project(102, "Ext Grid: Summary Rows", 1606, "Summary creation during rendering phase", 4, 125, 0, new DateTime(2007, 07, 02)),
                new Project(102, "Ext Grid: Summary Rows", 1607, "Dynamic summary updates in editor grids", 6, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 1608, "Remote summary integration", 4, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 1609, "Summary renderers and calculators", 4, 125, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 1610, "Integrate summaries with GroupingView", 10, 125, 0, new DateTime(2007, 07, 11)),
                new Project(100, "Ext Forms: Field Anchoring", 1173, "Implement AnchorLayout", 4, 150, 0, new DateTime(2007, 06, 25)),
                new Project(100, "Ext Forms: Field Anchoring", 1174, "Add support for multiple types of anchors", 4, 150, 0, new DateTime(2007, 06, 27)),
                new Project(100, "Ext Forms: Field Anchoring", 1175, "Testing and debugging", 8, 0, 0, new DateTime(2007, 06, 29)),
                new Project(101, "Ext Grid: Single-level Grouping", 1081, "Add required rendering \"hooks\" to GridView", 6, 100, 0, new DateTime(2007, 07, 01)),
                new Project(101, "Ext Grid: Single-level Grouping", 1802, "Extend GridView and override rendering functions", 6, 100, 0, new DateTime(2007, 07, 03)),
                new Project(101, "Ext Grid: Single-level Grouping", 103, "Extend Store with grouping functionality", 4, 100, 0, new DateTime(2007, 07, 04)),
                new Project(101, "Ext Grid: Single-level Grouping", 1821, "Default CSS Styling", 2, 100, 0, new DateTime(2007, 07, 05)),
                new Project(101, "Ext Grid: Single-level Grouping", 1804, "Testing and debugging", 6, 100, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 1085, "Ext 8Grid plugin integration", 4, 125, 0, new DateTime(2007, 07, 01)),
                new Project(102, "Ext Grid: Summary Rows", 106, "Summ88ary creation during rendering phase", 4, 125, 0, new DateTime(2007, 07, 02)),
                new Project(102, "Ext Grid: Summary Rows", 1087, "Dynamic summary updates in editor grids", 6, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 1098, "Remote summary integration", 4, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 1099, "Summary renderers and calculators", 4, 125, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 10910, "Integrate summaries with GroupingView", 10, 125, 0, new DateTime(2007, 07, 11)),
                new Project(100, "Ext Forms: Field Anchoring", 113, "Implement AnchorLayout", 4, 150, 0, new DateTime(2007, 06, 25)),
                new Project(100, "Ext Forms: Field Anchoring", 114, "Add support for multiple types of anchors", 4, 150, 0, new DateTime(2007, 06, 27)),
                new Project(100, "Ext Forms: Field Anchoring", 115, "Testing and debugging", 8, 0, 0, new DateTime(2007, 06, 29)),
                new Project(101, "Ext Grid: Single-level Grouping", 101, "Add required rendering \"hooks\" to GridView", 6, 100, 0, new DateTime(2007, 07, 01)),
                new Project(101, "Ext Grid: Single-level Grouping", 102, "Extend GridView and override rendering functions", 6, 100, 0, new DateTime(2007, 07, 03)),
                new Project(101, "Ext Grid: Single-level Grouping", 103, "Extend Store with grouping functionality", 4, 100, 0, new DateTime(2007, 07, 04)),
                new Project(101, "Ext Grid: Single-level Grouping", 121, "Default CSS Styling", 2, 100, 0, new DateTime(2007, 07, 05)),
                new Project(101, "Ext Grid: Single-level Grouping", 104, "Testing and debugging", 6, 100, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 105, "Ext Grid plugin integration", 4, 125, 0, new DateTime(2007, 07, 01)),
                new Project(102, "Ext Grid: Summary Rows", 106, "Summary creation during rendering phase", 4, 125, 0, new DateTime(2007, 07, 02)),
                new Project(102, "Ext Grid: Summary Rows", 107, "Dynamic summary updates in editor grids", 6, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 108, "Remote summary integration", 4, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 109, "Summary renderers and calculators", 4, 125, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 110, "Integrate summaries with GroupingView", 10, 125, 0, new DateTime(2007, 07, 11)),
                new Project(100, "Ext Forms: Field Anchoring", 113, "Implement AnchorLayout", 4, 150, 0, new DateTime(2007, 06, 25)),
                new Project(100, "Ext Forms: Field Anchoring", 114, "Add support for multiple types of anchors", 4, 150, 0, new DateTime(2007, 06, 27)),
                new Project(100, "Ext Forms: Field Anchoring", 115, "Testing and debugging", 8, 0, 0, new DateTime(2007, 06, 29)),
                new Project(101, "Ext Grid: Single-level Grouping", 101, "Add required rendering \"hooks\" to GridView", 6, 100, 0, new DateTime(2007, 07, 01)),
                new Project(101, "Ext Grid: Single-level Grouping", 102, "Extend GridView and override rendering functions", 6, 100, 0, new DateTime(2007, 07, 03)),
                new Project(101, "Ext Grid: Single-level Grouping", 103, "Extend Store with grouping functionality", 4, 100, 0, new DateTime(2007, 07, 04)),
                new Project(101, "Ext Grid: Single-level Grouping", 121, "Default CSS Styling", 2, 100, 0, new DateTime(2007, 07, 05)),
                new Project(101, "Ext Grid: Single-level Grouping", 104, "Testing and debugging", 6, 100, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 105, "Ext Grid plugin integration", 4, 125, 0, new DateTime(2007, 07, 01)),
                new Project(102, "Ext Grid: Summary Rows", 106, "Summary creation during rendering phase", 4, 125, 0, new DateTime(2007, 07, 02)),
                new Project(102, "Ext Grid: Summary Rows", 107, "Dynamic summary updates in editor grids", 6, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 108, "Remote summary integration", 4, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 109, "Summary renderers and calculators", 4, 125, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 110, "Integrate summaries with GroupingView", 10, 125, 0, new DateTime(2007, 07, 11)),
                new Project(100, "Ext Forms: Field Anchoring", 113, "Implement AnchorLayout", 4, 150, 0, new DateTime(2007, 06, 25)),
                new Project(100, "Ext Forms: Field Anchoring", 114, "Add support for multiple types of anchors", 4, 150, 0, new DateTime(2007, 06, 27)),
                new Project(100, "Ext Forms: Field Anchoring", 115, "Testing and debugging", 8, 0, 0, new DateTime(2007, 06, 29)),
                new Project(101, "Ext Grid: Single-level Grouping", 101, "Add required rendering \"hooks\" to GridView", 6, 100, 0, new DateTime(2007, 07, 01)),
                new Project(101, "Ext Grid: Single-level Grouping", 102, "Extend GridView and override rendering functions", 6, 100, 0, new DateTime(2007, 07, 03)),
                new Project(101, "Ext Grid: Single-level Grouping", 103, "Extend Store with grouping functionality", 4, 100, 0, new DateTime(2007, 07, 04)),
                new Project(101, "Ext Grid: Single-level Grouping", 121, "Default CSS Styling", 2, 100, 0, new DateTime(2007, 07, 05)),
                new Project(101, "Ext Grid: Single-level Grouping", 104, "Testing and debugging", 6, 100, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 105, "Ext Grid plugin integration", 4, 125, 0, new DateTime(2007, 07, 01)),
                new Project(102, "Ext Grid: Summary Rows", 106, "Summary creation during rendering phase", 4, 125, 0, new DateTime(2007, 07, 02)),
                new Project(102, "Ext Grid: Summary Rows", 107, "Dynamic summary updates in editor grids", 6, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 108, "Remote summary integration", 4, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 109, "Summary renderers and calculators", 4, 125, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 110, "Integrate summaries with GroupingView", 10, 125, 0, new DateTime(2007, 07, 11)),
                new Project(100, "Ext Forms: Field Anchoring", 113, "Implement AnchorLayout", 4, 150, 0, new DateTime(2007, 06, 25)),
                new Project(100, "Ext Forms: Field Anchoring", 114, "Add support for multiple types of anchors", 4, 150, 0, new DateTime(2007, 06, 27)),
                new Project(100, "Ext Forms: Field Anchoring", 115, "Testing and debugging", 8, 0, 0, new DateTime(2007, 06, 29)),
                new Project(101, "Ext Grid: Single-level Grouping", 101, "Add required rendering \"hooks\" to GridView", 6, 100, 0, new DateTime(2007, 07, 01)),
                new Project(101, "Ext Grid: Single-level Grouping", 102, "Extend GridView and override rendering functions", 6, 100, 0, new DateTime(2007, 07, 03)),
                new Project(101, "Ext Grid: Single-level Grouping", 103, "Extend Store with grouping functionality", 4, 100, 0, new DateTime(2007, 07, 04)),
                new Project(101, "Ext Grid: Single-level Grouping", 121, "Default CSS Styling", 2, 100, 0, new DateTime(2007, 07, 05)),
                new Project(101, "Ext Grid: Single-level Grouping", 104, "Testing and debugging", 6, 100, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 105, "Ext Grid plugin integration", 4, 125, 0, new DateTime(2007, 07, 01)),
                new Project(102, "Ext Grid: Summary Rows", 106, "Summary creation during rendering phase", 4, 125, 0, new DateTime(2007, 07, 02)),
                new Project(102, "Ext Grid: Summary Rows", 107, "Dynamic summary updates in editor grids", 6, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 108, "Remote summary integration", 4, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 109, "Summary renderers and calculators", 4, 125, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 110, "Integrate summaries with GroupingView", 10, 125, 0, new DateTime(2007, 07, 11)),
                new Project(100, "Ext Forms: Field Anchoring", 113, "Implement AnchorLayout", 4, 150, 0, new DateTime(2007, 06, 25)),
                new Project(100, "Ext Forms: Field Anchoring", 114, "Add support for multiple types of anchors", 4, 150, 0, new DateTime(2007, 06, 27)),
                new Project(100, "Ext Forms: Field Anchoring", 115, "Testing and debugging", 8, 0, 0, new DateTime(2007, 06, 29)),
                new Project(101, "Ext Grid: Single-level Grouping", 101, "Add required rendering \"hooks\" to GridView", 6, 100, 0, new DateTime(2007, 07, 01)),
                new Project(101, "Ext Grid: Single-level Grouping", 102, "Extend GridView and override rendering functions", 6, 100, 0, new DateTime(2007, 07, 03)),
                new Project(101, "Ext Grid: Single-level Grouping", 103, "Extend Store with grouping functionality", 4, 100, 0, new DateTime(2007, 07, 04)),
                new Project(101, "Ext Grid: Single-level Grouping", 121, "Default CSS Styling", 2, 100, 0, new DateTime(2007, 07, 05)),
                new Project(101, "Ext Grid: Single-level Grouping", 104, "Testing and debugging", 6, 100, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 105, "Ext Grid plugin integration", 4, 125, 0, new DateTime(2007, 07, 01)),
                new Project(102, "Ext Grid: Summary Rows", 106, "Summary creation during rendering phase", 4, 125, 0, new DateTime(2007, 07, 02)),
                new Project(102, "Ext Grid: Summary Rows", 107, "Dynamic summary updates in editor grids", 6, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 108, "Remote summary integration", 4, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 109, "Summary renderers and calculators", 4, 125, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 110, "Integrate summaries with GroupingView", 10, 125, 0, new DateTime(2007, 07, 11)),
                new Project(100, "Ext Forms: Field Anchoring", 113, "Implement AnchorLayout", 4, 150, 0, new DateTime(2007, 06, 25)),
                new Project(100, "Ext Forms: Field Anchoring", 114, "Add support for multiple types of anchors", 4, 150, 0, new DateTime(2007, 06, 27)),
                new Project(100, "Ext Forms: Field Anchoring", 115, "Testing and debugging", 8, 0, 0, new DateTime(2007, 06, 29)),
                new Project(101, "Ext Grid: Single-level Grouping", 101, "Add required rendering \"hooks\" to GridView", 6, 100, 0, new DateTime(2007, 07, 01)),
                new Project(101, "Ext Grid: Single-level Grouping", 102, "Extend GridView and override rendering functions", 6, 100, 0, new DateTime(2007, 07, 03)),
                new Project(101, "Ext Grid: Single-level Grouping", 103, "Extend Store with grouping functionality", 4, 100, 0, new DateTime(2007, 07, 04)),
                new Project(101, "Ext Grid: Single-level Grouping", 121, "Default CSS Styling", 2, 100, 0, new DateTime(2007, 07, 05)),
                new Project(101, "Ext Grid: Single-level Grouping", 104, "Testing and debugging", 6, 100, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 105, "Ext Grid plugin integration", 4, 125, 0, new DateTime(2007, 07, 01)),
                new Project(102, "Ext Grid: Summary Rows", 106, "Summary creation during rendering phase", 4, 125, 0, new DateTime(2007, 07, 02)),
                new Project(102, "Ext Grid: Summary Rows", 107, "Dynamic summary updates in editor grids", 6, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 108, "Remote summary integration", 4, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 109, "Summary renderers and calculators", 4, 125, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 110, "Integrate summaries with GroupingView", 10, 125, 0, new DateTime(2007, 07, 11)),
                new Project(100, "Ext Forms: Field Anchoring", 113, "Implement AnchorLayout", 4, 150, 0, new DateTime(2007, 06, 25)),
                new Project(100, "Ext Forms: Field Anchoring", 114, "Add support for multiple types of anchors", 4, 150, 0, new DateTime(2007, 06, 27)),
                new Project(100, "Ext Forms: Field Anchoring", 115, "Testing and debugging", 8, 0, 0, new DateTime(2007, 06, 29)),
                new Project(101, "Ext Grid: Single-level Grouping", 101, "Add required rendering \"hooks\" to GridView", 6, 100, 0, new DateTime(2007, 07, 01)),
                new Project(101, "Ext Grid: Single-level Grouping", 102, "Extend GridView and override rendering functions", 6, 100, 0, new DateTime(2007, 07, 03)),
                new Project(101, "Ext Grid: Single-level Grouping", 103, "Extend Store with grouping functionality", 4, 100, 0, new DateTime(2007, 07, 04)),
                new Project(101, "Ext Grid: Single-level Grouping", 121, "Default CSS Styling", 2, 100, 0, new DateTime(2007, 07, 05)),
                new Project(101, "Ext Grid: Single-level Grouping", 104, "Testing and debugging", 6, 100, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 105, "Ext Grid plugin integration", 4, 125, 0, new DateTime(2007, 07, 01)),
                new Project(102, "Ext Grid: Summary Rows", 106, "Summary creation during rendering phase", 4, 125, 0, new DateTime(2007, 07, 02)),
                new Project(102, "Ext Grid: Summary Rows", 107, "Dynamic summary updates in editor grids", 6, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 108, "Remote summary integration", 4, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 109, "Summary renderers and calculators", 4, 125, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 110, "Integrate summaries with GroupingView", 10, 125, 0, new DateTime(2007, 07, 11)),
                new Project(100, "Ext Forms: Field Anchoring", 113, "Implement AnchorLayout", 4, 150, 0, new DateTime(2007, 06, 25)),
                new Project(100, "Ext Forms: Field Anchoring", 114, "Add support for multiple types of anchors", 4, 150, 0, new DateTime(2007, 06, 27)),
                new Project(100, "Ext Forms: Field Anchoring", 115, "Testing and debugging", 8, 0, 0, new DateTime(2007, 06, 29)),
                new Project(101, "Ext Grid: Single-level Grouping", 101, "Add required rendering \"hooks\" to GridView", 6, 100, 0, new DateTime(2007, 07, 01)),
                new Project(101, "Ext Grid: Single-level Grouping", 102, "Extend GridView and override rendering functions", 6, 100, 0, new DateTime(2007, 07, 03)),
                new Project(101, "Ext Grid: Single-level Grouping", 103, "Extend Store with grouping functionality", 4, 100, 0, new DateTime(2007, 07, 04)),
                new Project(101, "Ext Grid: Single-level Grouping", 121, "Default CSS Styling", 2, 100, 0, new DateTime(2007, 07, 05)),
                new Project(101, "Ext Grid: Single-level Grouping", 104, "Testing and debugging", 6, 100, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 105, "Ext Grid plugin integration", 4, 125, 0, new DateTime(2007, 07, 01)),
                new Project(102, "Ext Grid: Summary Rows", 106, "Summary creation during rendering phase", 4, 125, 0, new DateTime(2007, 07, 02)),
                new Project(102, "Ext Grid: Summary Rows", 107, "Dynamic summary updates in editor grids", 6, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 108, "Remote summary integration", 4, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 109, "Summary renderers and calculators", 4, 125, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 110, "Integrate summaries with GroupingView", 10, 125, 0, new DateTime(2007, 07, 11)),
                new Project(100, "Ext Forms: Field Anchoring", 113, "Implement AnchorLayout", 4, 150, 0, new DateTime(2007, 06, 25)),
                new Project(100, "Ext Forms: Field Anchoring", 114, "Add support for multiple types of anchors", 4, 150, 0, new DateTime(2007, 06, 27)),
                new Project(100, "Ext Forms: Field Anchoring", 115, "Testing and debugging", 8, 0, 0, new DateTime(2007, 06, 29)),
                new Project(101, "Ext Grid: Single-level Grouping", 101, "Add required rendering \"hooks\" to GridView", 6, 100, 0, new DateTime(2007, 07, 01)),
                new Project(101, "Ext Grid: Single-level Grouping", 102, "Extend GridView and override rendering functions", 6, 100, 0, new DateTime(2007, 07, 03)),
                new Project(101, "Ext Grid: Single-level Grouping", 103, "Extend Store with grouping functionality", 4, 100, 0, new DateTime(2007, 07, 04)),
                new Project(101, "Ext Grid: Single-level Grouping", 121, "Default CSS Styling", 2, 100, 0, new DateTime(2007, 07, 05)),
                new Project(101, "Ext Grid: Single-level Grouping", 104, "Testing and debugging", 6, 100, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 105, "Ext Grid plugin integration", 4, 125, 0, new DateTime(2007, 07, 01)),
                new Project(102, "Ext Grid: Summary Rows", 106, "Summary creation during rendering phase", 4, 125, 0, new DateTime(2007, 07, 02)),
                new Project(102, "Ext Grid: Summary Rows", 107, "Dynamic summary updates in editor grids", 6, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 108, "Remote summary integration", 4, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 109, "Summary renderers and calculators", 4, 125, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 110, "Integrate summaries with GroupingView", 10, 125, 0, new DateTime(2007, 07, 11)),
                new Project(100, "Ext Forms: Field Anchoring", 113, "Implement AnchorLayout", 4, 150, 0, new DateTime(2007, 06, 25)),
                new Project(100, "Ext Forms: Field Anchoring", 114, "Add support for multiple types of anchors", 4, 150, 0, new DateTime(2007, 06, 27)),
                new Project(100, "Ext Forms: Field Anchoring", 115, "Testing and debugging", 8, 0, 0, new DateTime(2007, 06, 29)),
                new Project(101, "Ext Grid: Single-level Grouping", 101, "Add required rendering \"hooks\" to GridView", 6, 100, 0, new DateTime(2007, 07, 01)),
                new Project(101, "Ext Grid: Single-level Grouping", 102, "Extend GridView and override rendering functions", 6, 100, 0, new DateTime(2007, 07, 03)),
                new Project(101, "Ext Grid: Single-level Grouping", 103, "Extend Store with grouping functionality", 4, 100, 0, new DateTime(2007, 07, 04)),
                new Project(101, "Ext Grid: Single-level Grouping", 121, "Default CSS Styling", 2, 100, 0, new DateTime(2007, 07, 05)),
                new Project(101, "Ext Grid: Single-level Grouping", 104, "Testing and debugging", 6, 100, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 105, "Ext Grid plugin integration", 4, 125, 0, new DateTime(2007, 07, 01)),
                new Project(102, "Ext Grid: Summary Rows", 106, "Summary creation during rendering phase", 4, 125, 0, new DateTime(2007, 07, 02)),
                new Project(102, "Ext Grid: Summary Rows", 107, "Dynamic summary updates in editor grids", 6, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 108, "Remote summary integration", 4, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 109, "Summary renderers and calculators", 4, 125, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 110, "Integrate summaries with GroupingView", 10, 125, 0, new DateTime(2007, 07, 11)),
                new Project(100, "Ext Forms: Field Anchoring", 113, "Implement AnchorLayout", 4, 150, 0, new DateTime(2007, 06, 25)),
                new Project(100, "Ext Forms: Field Anchoring", 114, "Add support for multiple types of anchors", 4, 150, 0, new DateTime(2007, 06, 27)),
                new Project(100, "Ext Forms: Field Anchoring", 115, "Testing and debugging", 8, 0, 0, new DateTime(2007, 06, 29)),
                new Project(101, "Ext Grid: Single-level Grouping", 101, "Add required rendering \"hooks\" to GridView", 6, 100, 0, new DateTime(2007, 07, 01)),
                new Project(101, "Ext Grid: Single-level Grouping", 102, "Extend GridView and override rendering functions", 6, 100, 0, new DateTime(2007, 07, 03)),
                new Project(101, "Ext Grid: Single-level Grouping", 103, "Extend Store with grouping functionality", 4, 100, 0, new DateTime(2007, 07, 04)),
                new Project(101, "Ext Grid: Single-level Grouping", 121, "Default CSS Styling", 2, 100, 0, new DateTime(2007, 07, 05)),
                new Project(101, "Ext Grid: Single-level Grouping", 104, "Testing and debugging", 6, 100, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 105, "Ext Grid plugin integration", 4, 125, 0, new DateTime(2007, 07, 01)),
                new Project(102, "Ext Grid: Summary Rows", 106, "Summary creation during rendering phase", 4, 125, 0, new DateTime(2007, 07, 02)),
                new Project(102, "Ext Grid: Summary Rows", 107, "Dynamic summary updates in editor grids", 6, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 108, "Remote summary integration", 4, 125, 0, new DateTime(2007, 07, 05)),
                new Project(102, "Ext Grid: Summary Rows", 109, "Summary renderers and calculators", 4, 125, 0, new DateTime(2007, 07, 06)),
                new Project(102, "Ext Grid: Summary Rows", 110, "Integrate summaries with GroupingView", 10, 125, 0, new DateTime(2007, 07, 11)),
                new Project(102, "Ext Grid: Summary Rows", 111, "Testing and debugging", 8, 125, 0, new DateTime(2007, 07, 15))
             };
    
    
            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>
    
    
    <!DOCTYPE html>
    
    
    <html>
    <head id="Head1" runat="server">
        <title>Locking, Cell Editing Summary Grid - Ext.NET Examples</title>
    
    
        <link href="/resources/css/examples.css" rel="stylesheet" />
            <script type="text/javascript">
                // this "setGroupStyle" function is called when the GroupingView is refreshed.     
                var setGroupStyle = function (view) {
                    return;
                    var colors = ['olive', 'orange', 'purple', 'red', 'blue', 'fuchsia', 'gray', 'green', 'maroon', 'navy', 'silver', 'teal', 'black']
                    // get an instance of the Groups
                    var groups = view.el.query(App.GridPanel1.eventSelector);
    
    
                    for (var i = 0; i < groups.length; i++) {
                        // Set the "background-color" of the original Group node.
                        Ext.get(groups[i]).parent().select('.x-grid-group-hd').setStyle("background-color", colors[i % colors.length]);
                    }
                };
    
    
        </script>
    
    
        <style>
            .x-grid-body .x-grid-cell-Cost {
                background-color : #f1f2f4;
            }
    
    
            .x-grid-row-summary .x-grid-cell-Cost .x-grid-cell-inner{
                background-color : #e1e2e4;
            }
    
    
            .task .x-grid-cell-inner {
                padding-left: 15px;
            }
    
    
            .x-grid-row-summary .x-grid-cell-inner {
                font-weight: bold;
                font-size: 11px;
                background-color : #f1f2f4;
            }
        </style>
    
    
        <script>
            var showSummary = true;
    
    
            var totalCost = function (records) {
                var i = 0,
                    length = records.length,
                    total = 0,
                    record;
    
    
                for (; i < length; ++i) {
                    record = records[i];
                    total += record.get('Estimate') * record.get('Rate');
                }
                return total;
            };
    
    
            var toggleSummary = function (b) {
                showSummary = !showSummary;
    
    
                var grid = b.up('gridpanel'),
                    view = grid.lockedGrid.getView();
    
    
                view.getFeature('group').toggleSummaryRow(showSummary);
                view.refresh();
                view = grid.normalGrid.getView();
                view.getFeature('group').toggleSummaryRow(showSummary);
                view.refresh();
            };
        </script>
    </head>
    <body>
        <form id="Form1" runat="server">
            <ext:ResourceManager ID="ResourceManager1" runat="server"/>
    
    
            <h1>Locking, Cell Editing Summary Grid Example</h1>
    
    
            <p>It is not possible to lock or unlock <i>all</i> columns using the user interface. Each side, locked or unlocked must always contain at least one column.</p>
    
    
            <ext:GridPanel
                ID="GridPanel1"
                runat="server"
                Frame="true"
                Title="Sponsored Projects"
                Layout="FitLayout"
                Icon="ApplicationViewColumns">
                <Store>
                    <ext:Store ID="Store1" runat="server" GroupField="Name">
                        <Sorters>
                            <ext:DataSorter Property="Due" Direction="ASC" />
                        </Sorters>
                        <Model>
                            <ext:Model ID="Model1" runat="server" IDProperty="TaskID">
                                <Fields>
                                    <ext:ModelField Name="ProjectID" Type="Int" />
                                    <ext:ModelField Name="Name" />
                                    <ext:ModelField Name="TaskID" Type="Int" />
                                    <ext:ModelField Name="Description" />
                                    <ext:ModelField Name="Estimate" Type="Int" />
                                    <ext:ModelField Name="Rate" Type="Float" />
                                    <ext:ModelField Name="Cost" Type="Float" />
                                    <ext:ModelField Name="Due" Type="Date" />
                                </Fields>
                            </ext:Model>
                        </Model>
                    </ext:Store>
                </Store>
                <Plugins>
                    <ext:CellEditing ID="CellEditing1" runat="server" ClicksToEdit="1" />
                </Plugins>
                <ColumnModel ID="ColumnModel1" runat="server">
                    <Columns>
                        <ext:Column ID="Column1"
                            runat="server"
                            Locked="true"
                            TdCls="task"
                            Text="Task"
                            Sortable="true"
                            DataIndex="Description"
                            Hideable="false"
                            SummaryType="Count"
                            Width="300">
                        </ext:Column>
    
    
                        <ext:Column ID="Column2" runat="server" Text="Project" DataIndex="Name" Width="180" />
    
    
                        <ext:DateColumn ID="DateColumn1"
                            runat="server"
                            Width="130"
                            Text="Due Date"
                            Sortable="true"
                            DataIndex="Due"
                            SummaryType="Max"
                            Format="MM/dd/yyyy">
                            <Editor>
                                <ext:DateField ID="DateField1" runat="server" Format="MM/dd/yyyy" />
                            </Editor>
                            <%-- Remove after fixing #563 --%>
                        </ext:DateColumn>
    
    
                        <ext:Column ID="Column3"
                            runat="server"
                            Width="130"
                            Text="Estimate"
                            Sortable="true"
                            DataIndex="Estimate"
                            SummaryType="Sum">
                            <Renderer Handler="return value +' hours';" />
                            <%-- Remove after fixing #563 --%>
                            <Editor>
                                <ext:NumberField ID="NumberField1"
                                    runat="server"
                                    AllowBlank="false"
                                    MinValue="0"
                                    StyleSpec="text-align:left"
                                    />
                            </Editor>
                        </ext:Column>
    
    
                        <ext:Column ID="Column4"
                            runat="server"
                            Width="130"
                            Text="Rate"
                            Sortable="true"
                            DataIndex="Rate"
                            SummaryType="Average">
                            <Renderer Format="UsMoney" />
                            <%-- Remove after fixing #563 --%>
                            <Editor>
                                <ext:NumberField ID="NumberField2"
                                    runat="server"
                                    AllowBlank="false"
                                    MinValue="0"
                                    StyleSpec="text-align:left"
                                    />
                            </Editor>
                        </ext:Column>
    
    
                        <ext:Column
                            runat="server"
                            Width="130"
                            ID="Cost"
                            Text="Cost"
                            Sortable="false"
                            Groupable="false"
                            DataIndex="Cost"
                            CustomSummaryType="totalCost">
                            <Renderer Handler="return Ext.util.Format.usMoney(record.data.Estimate * record.data.Rate);" />
                            <%-- Remove after fixing #563 --%>
                        </ext:Column>
                            <ext:Column ID="Column5" runat="server" Text="Column stset" Width="500">
                                <Editor>
                                    <ext:ComboBox ID="ComboBox1" runat="server" />
                                </Editor>
                            </ext:Column>
                            <ext:Column ID="Column6" runat="server" Text="Column 2" Width="600">
                                <Editor>
                                    <ext:ComboBox ID="ComboBox2" runat="server" />
                                </Editor>
                            </ext:Column>
                            <ext:Column ID="Column7" runat="server" Text="Column 3" Width="600">
                                <Editor>
                                    <ext:ComboBox ID="ComboBox3" runat="server" />
                                </Editor>
                            </ext:Column>
                            <ext:Column ID="Column8" runat="server" Text="Column 3" Width="600">
                                <Editor>
                                    <ext:ComboBox ID="ComboBox4" runat="server" />
                                </Editor>
                            </ext:Column>
                            <ext:Column ID="Column9" runat="server" Text="Column 3" Width="600">
                                <Editor>
                                    <ext:ComboBox ID="ComboBox5" runat="server" />
                                </Editor>
                            </ext:Column>
                            <ext:Column ID="Column10" runat="server" Text="Column 3" Width="600">
                                <Editor>
                                    <ext:ComboBox ID="ComboBox6" runat="server" />
                                </Editor>
                            </ext:Column>
                            <ext:Column ID="Column11" runat="server" Text="Column 3" Width="600">
                                <Editor>
                                    <ext:ComboBox ID="ComboBox7" runat="server" />
                                </Editor>
                            </ext:Column>
                            <ext:Column ID="Column12" runat="server" Text="Column 3" Width="600">
                                <Editor>
                                    <ext:ComboBox ID="ComboBox8" runat="server" />
                                </Editor>
                            </ext:Column>
                            <ext:Column ID="Column13" runat="server" Text="Column 3" Width="600">
                                <Editor>
                                    <ext:ComboBox ID="ComboBox9" runat="server" />
                                </Editor>
                            </ext:Column>
                            <ext:Column ID="Column14" runat="server" Text="Column 3" Width="600">
                                <Editor>
                                    <ext:ComboBox ID="ComboBox10" runat="server" />
                                </Editor>
                            </ext:Column>
                            <ext:Column ID="Column15" runat="server" Text="Column 3" Width="600">
                                <Editor>
                                    <ext:ComboBox ID="ComboBox11" runat="server" />
                                </Editor>
                            </ext:Column>
                            <ext:Column ID="Column16" runat="server" Text="Column 3" Width="600">
                                <Editor>
                                    <ext:ComboBox ID="ComboBox12" runat="server" />
                                </Editor>
                            </ext:Column>
                            <ext:Column ID="Column17" runat="server" Text="Column 3" Width="600">
                                <Editor>
                                    <ext:ComboBox ID="ComboBox13" runat="server" />
                                </Editor>
                            </ext:Column>
                            <ext:Column ID="Column18" runat="server" Text="Column 3" Width="600">
                                <Editor>
                                    <ext:ComboBox ID="ComboBox14" runat="server" />
                                </Editor>
                            </ext:Column>
                            <ext:Column ID="Column19" runat="server" Text="Column 3" Width="600">
                                <Editor>
                                    <ext:ComboBox ID="ComboBox15" runat="server" />
                                </Editor>
                            </ext:Column>
                            <ext:Column ID="Column20" runat="server" Text="Column 3" Width="600">
                                <Editor>
                                    <ext:ComboBox ID="ComboBox16" runat="server" />
                                </Editor>
                            </ext:Column>
                            <ext:Column ID="Column21" runat="server" Text="Column 3" Width="600">
                                <Editor>
                                    <ext:ComboBox ID="ComboBox17" runat="server" />
                                </Editor>
                            </ext:Column>
                            <ext:Column ID="Column22" runat="server" Text="Column 3" Width="600">
                                <Editor>
                                    <ext:ComboBox ID="ComboBox18" runat="server" />
                                </Editor>
                            </ext:Column>
                            <ext:Column ID="Column23" runat="server" Text="Column 3" Width="600">
                                <Editor>
                                    <ext:ComboBox ID="ComboBox19" runat="server" />
                                </Editor>
                            </ext:Column>
                            <ext:Column ID="Column24" runat="server" Text="Column 3" Width="600">
                                <Editor>
                                    <ext:ComboBox ID="ComboBox20" runat="server" />
                                </Editor>
                            </ext:Column>
                            <ext:Column ID="Column25" runat="server" Text="Column 3" Width="600">
                                <Editor>
                                    <ext:ComboBox ID="ComboBox21" runat="server" />
                                </Editor>
                            </ext:Column>
                            <ext:Column ID="Column26" runat="server" Text="Column 3" Width="600">
                                <Editor>
                                    <ext:ComboBox ID="ComboBox22" runat="server" />
                                </Editor>
                            </ext:Column>
                            <ext:Column ID="Column27" runat="server" Text="Column 3" Width="600">
                                <Editor>
                                    <ext:ComboBox ID="ComboBox23" runat="server" />
                                </Editor>
                            </ext:Column>
                    </Columns>
                </ColumnModel>
                <Features>
                    <ext:GroupingSummary
                        ID="group"
                        runat="server"
                        GroupHeaderTplString='<span style="color:white">({[values.rows.length]} {[values.rows.length > 1 ? "Test" : "Test"]})</span>'
                        HideGroupedHeader="true"
                        EnableGroupingMenu="false"
                        />
                </Features>
                <View>
                    <ext:GridView ID="GridView1" runat="server" TrackOver="false">
                        <Listeners>
                            <Refresh Fn="setGroupStyle" />
                            <ViewReady Handler="this.on('scroll', setGroupStyle, this, { buffer: 500 });" />
                        </Listeners>
                    </ext:GridView>
                </View>
                <TopBar>
                    <ext:Toolbar ID="Toolbar1" runat="server">
                        <Items>
                            <ext:Button ID="Button1"
                                runat="server"
                                Text="Toggle"
                                ToolTip="Toggle the visibility of summary row"
                                EnableToggle="true"
                                Pressed="true">
                                <Listeners>
                                    <Click Fn="toggleSummary" />
                                </Listeners>
                            </ext:Button>
                        </Items>
                    </ext:Toolbar>
                </TopBar>
                <SelectionModel>
                    <ext:CellSelectionModel ID="CellSelectionModel1" runat="server" />
                </SelectionModel>
            </ext:GridPanel>
        </form>
      </body>
    </html>


    Thanks,
    /Z
    Last edited by fabricio.murta; Jun 12, 2017 at 8:32 PM.
  2. #2
    Hello @Z!

    I'm afraid I can't see the issue you're talking about in your topic (1) while using SPAN in the grouping header. You set foreground to white, nothing would be shown because the background is also white.

    Besides, it uses an undocumented values property. Check out docs on GroupingSummary's groupHeaderTpl for versions 5.1.2 and 6.2.1 of ExtJS. Neither point using a values variable in that context. So this bit could stop working in any next version without prior notice.

    If I set any other foreground color, it works fine. This for example would seem to work fine -- if the idea here is just to color the font in the header:

    GroupHeaderTplString='<span style="color:tan">{name} ({[values.rows.length]} entr{[values.rows.length > 1 ? "ies" : "y"]})</span>'
    As for your topic (2), I'm afraid the grouped header cell is governed by a CSS rule, and just setting the header template span's background color just makes a background surrounding the text, as with a marker pen.

    So, as for having a plain, fixed background color on the whole cell, you can just override the CSS:

    .x-grid-group-hd {
        background-color: aquamarine
    }
    Looking back at version 3, I see the same structure when I run your example on Ext.NET version 3, so I'm even more confused where is the breaking change expected here.

    I'm assuming when you mentioned the background color setting, you try to set the background-color CSS property to the SPAN element you write to the GroupHeaderTplString.
    Fabrício Murta
    Developer & Support Expert
  3. #3
    I removed my workaround and used the css style.
    you can close
    thxs
    /Z
  4. #4
    Glad the CSS override worked for you! Thanks for the feedback, @Z!
    Fabrício Murta
    Developer & Support Expert

Similar Threads

  1. [CLOSED] Grouped Columns in Grid
    By anwichmann in forum 3.x Premium Help
    Replies: 4
    Last Post: Dec 08, 2015, 4:44 PM
  2. [CLOSED] Grouped Headers Column
    By 78fede78 in forum 1.x Premium Help
    Replies: 2
    Last Post: Sep 23, 2010, 1:56 PM
  3. [CLOSED] Add Row to Grouped Grid.
    By rthiney in forum 1.x Premium Help
    Replies: 2
    Last Post: Feb 05, 2010, 4:43 PM
  4. Grouped grid very slow
    By testix in forum 1.x Help
    Replies: 3
    Last Post: Sep 19, 2009, 1:46 PM
  5. Grid Headers
    By simonmicheal in forum 1.x Help
    Replies: 2
    Last Post: Aug 28, 2009, 1:53 PM

Posting Permissions