1. Home
  2. Forum
  3. Blazor
  4. How to remove the grouped text in the grid

How to remove the grouped text in the grid

Hi,

In the grid i am grouping based on 3 columns, in the rows of the grid the grouped text is getting displayed which i want to remove them


In the rows which is highlighted with yellow color want to remove them.

code 

   <SfGrid @ref="DefaultGrid" DataSource="@GridData" AllowPaging="true" AllowGrouping="true" Toolbar="toolbar" AllowSelection="true">

                    <GridGroupSettings Columns=@GroupedColumn></GridGroupSettings>

                   <GridEvents RowSelected="RowSelectHandler" RowDeselected="RowDeselectHandler" TValue="ProjectSite"></GridEvents>

                    <GridPageSettings PageCount="5"></GridPageSettings>


                    <GridEditSettings AllowEditing="true">

                        <FooterTemplate>

                            <SfButton>Savef</SfButton>

                            <SfButton>Cancelf</SfButton>

                        </FooterTemplate>

                    </GridEditSettings>

                    <GridColumns>

                        <GridColumn Field=@nameof(ProjectSite.ProgramProjectSiteId) HeaderText="ProgramProjectSiteId" Width="150" Visible=false IsPrimaryKey="true"></GridColumn>

                        <GridColumn Field=@nameof(ProjectSite.SiteId) HeaderText="SiteId" Width="210" Visible=false></GridColumn>

                        <GridColumn Field=@nameof(ProjectSite.SiteAssetId) HeaderText="SiteAssetId" Width="170" Visible=false></GridColumn>

                        <GridColumn Field=@nameof(ProjectSite.SiteOpenIssueId) HeaderText="SiteOpenIssueId" TextAlign="TextAlign.Right" Width="170" Visible=false></GridColumn>

                        <GridColumn Field=@nameof(ProjectSite.ProjectTypeId) HeaderText="SiteOpenIssueId" TextAlign="TextAlign.Right" Width="170" Visible=false></GridColumn>

                        <GridColumn Field=@nameof(ProjectSite.Level1) HeaderText="Level1" TextAlign="TextAlign.Right" Width="170"></GridColumn>

                        <GridColumn Field=@nameof(ProjectSite.SiteName) HeaderText="SiteName" TextAlign="TextAlign.Right" Width="170"></GridColumn>

                        <GridColumn Field=@nameof(ProjectSite.Level2) HeaderText="Level2" TextAlign="TextAlign.Right" Width="170"></GridColumn>

                        <GridColumn Field=@nameof(ProjectSite.Level3) HeaderText="Level3" TextAlign="TextAlign.Right" Width="170"></GridColumn>

                        <GridColumn Field=@nameof(ProjectSite.RemoteType) HeaderText="RemoteType" TextAlign="TextAlign.Right" Width="170"></GridColumn>

                        <GridColumn Field=@nameof(ProjectSite.Origin) HeaderText="Origin" TextAlign="TextAlign.Right" Width="170"></GridColumn>

                        <GridColumn Field=@nameof(ProjectSite.State) HeaderText="State" TextAlign="TextAlign.Right" Width="170"></GridColumn>

                        <GridColumn Field=@nameof(ProjectSite.Owner) HeaderText="Owner" TextAlign="TextAlign.Right" Width="170"></GridColumn>

                        <GridColumn Field=@nameof(ProjectSite.IssueId) HeaderText="IssueId" TextAlign="TextAlign.Right" Width="170"></GridColumn>

                        <GridColumn Field=@nameof(ProjectSite.IssueType) HeaderText="IssueType" TextAlign="TextAlign.Right" Width="170"></GridColumn>

                        <GridColumn Field=@nameof(ProjectSite.LastInspectionDate) HeaderText="LastInspectionDate" TextAlign="TextAlign.Right" Width="170"></GridColumn>

                        <GridColumn Field=@nameof(ProjectSite.ReviewInspectionDate) HeaderText="ReviewInspectionDate" TextAlign="TextAlign.Right" Width="170"></GridColumn>

                        <GridColumn Field=@nameof(ProjectSite.ResultId) HeaderText="ResultId" Width="120" Type="ColumnType.CheckBox" TextAlign="TextAlign.Center"></GridColumn>

                    </GridColumns>

                </SfGrid>


Please provide me any code sample where i can remove these.

Thank you

R.Ajaykumar


1 Reply
RN Rahul Narayanasamy Syncfusion Team February 14, 2022 02:09 PM UTC

Hi Ajay, 

Greetings from Syncfusion. 

Query 
Solution 
In the grid i am grouping based on 3 columns, in the rows of the grid the grouped text is getting displayed which i want to remove them 
We suspect would you like to remove the grouped column name in Group drop area. You can achieve your requirement by using ShowDropArea property of GridGroupSettings. 

Find the below code snippets for your reference. 

@{ 
    var Initial = (new string[] { "CustomerID", "OrderID" }); 
} 
<SfGrid DataSource="@Orders" AllowGrouping="true" Height="400"> 
    <GridGroupSettings Columns="@Initial" ShowDropArea="false"> 
        <CaptionTemplate> 
            @{ 
                var order = (context as CaptionTemplateContext); 
                <div>@order.Key - @order.Count items </div> 
            } 
        </CaptionTemplate> 
    </GridGroupSettings> 
    <GridColumns> 
        . ..  
    </GridColumns> 
</SfGrid> 

Reference:  


In the rows which is highlighted with yellow color want to remove them. – Want to remove Field name in Group Caption area 
You want to remove the Field name in Group caption area. You can achieve your requirement by using CaptionTemplate.  

Find the below code snippets for your reference. 

<GridGroupSettings Columns="@Initial" ShowDropArea="false"> 
        <CaptionTemplate> 
            @{ 
                var order = (context as CaptionTemplateContext); 
                <div>@order.Key - @order.Count items </div> 
            } 
        </CaptionTemplate> 
    </GridGroupSettings> 


Reference: 



Please let us know if you have any concerns. 

Regards, 
Rahul  


Loader.
Up arrow icon