We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Add a Combobox into column header to switch type

Greetings!

I am using SfDataGrid to show data from Excel file.

I would like to create a column header custom template like that:


And give a possibility to change type between string and number, and mark column with alphabetical letters.

Is it possible to do?

Looking forward for your answer.

3 Replies

MA Mohanram Anbukkarasu Syncfusion Team November 19, 2019 12:44 PM UTC

Hi Aleksander,   
  
Thanks for contacting Syncfusion support.   
  
It is possible to set custom template for column header in DataGrid using the properties SfDataGrid.HeaderTemplate and GridColumn.HeaderTemplate as given in the below UG link.    
  
  
We are unclear with your requirement to change the type between string and number whether you need to change the type of the column from text column to numeric column or you need to change the entire data in the specific column from string to numbers. Please provide us more details regarding your requirement. It will be helpful for us to provide a prompt solution.   
  
Regards,   
Mohanram A  




AZ Aleksander Zotov November 19, 2019 02:58 PM UTC

I need to switch data type in entire column between string and number. 
Or at least know how to access data from a column within using combobox in header template.
and I would like to numerate columns like Excel does A,B,C....

Plus, how can I show in RowHeader and range index?

Thank you in advance!


MA Mohanram Anbukkarasu Syncfusion Team November 20, 2019 01:23 PM UTC

Hi Aleksander, 

Thanks for your update. 


Query 
Response 
 I would like to numerate columns like Excel does A,B,C.... 

Plus, how can I show in RowHeader and range index? 

You can customize row header by writing style of TargetType RowHeaderCell as shown in the following code example. 

Code example :  

<Window.Resources> 
    <Style TargetType="syncfusion:GridRowHeaderCell"> 
        <Setter Property="Template"> 
            <Setter.Value> 
                <ControlTemplate TargetType="syncfusion:GridRowHeaderCell"> 
                    <Border x:Name="PART_RowHeaderCellBorder" 
                    BorderBrush="{TemplateBinding BorderBrush}" 
                    BorderThickness="{TemplateBinding BorderThickness}"> 
                        <Grid> 
                            <!--RowIndex is displayed here --> 
                            <TextBlock HorizontalAlignment="Center" 
                                VerticalAlignment="Center" 
                                Text="{Binding RowIndex, Converter={StaticResource rowIndexConverter}, 
                                RelativeSource={RelativeSource TemplatedParent}}" 
                                TextAlignment="Center" /> 
                        </Grid> 
                    </Border> 
                </ControlTemplate> 
            </Setter.Value> 
        </Setter> 
    </Style> 
</Window.Resources> 


Alphabets can be displayed on for the column by adding stacked header row as shown in the below code example. 

Code example :  

<syncfusion:SfDataGrid.StackedHeaderRows> 
    <syncfusion:StackedHeaderRow> 
        <syncfusion:StackedHeaderRow.StackedColumns> 
            <syncfusion:StackedColumn ChildColumns="FirstName" HeaderText="A" /> 
            <syncfusion:StackedColumn ChildColumns="LastName" HeaderText="B" /> 
            <syncfusion:StackedColumn ChildColumns="ID" HeaderText="C" /> 
            <syncfusion:StackedColumn ChildColumns="Title" HeaderText="D" /> 
            <syncfusion:StackedColumn ChildColumns="Salary" HeaderText="E" /> 
        </syncfusion:StackedHeaderRow.StackedColumns> 
    </syncfusion:StackedHeaderRow> 
</syncfusion:SfDataGrid.StackedHeaderRows> 

 

We have prepared a sample using the above code example and it is available in the following link for your reference. 



I need to switch data type in entire column between string and number.  
Or at least know how to access data from a column within using combobox in header template. 

It is not possible to get the specific column and its data within the SelectionChanged event of the combo box in the header template of the column. Please provide more details about this requirement and the reason to switch between the type. So that we can analyze and check for any other possibilities to achieve your requirement.  


Regards, 
Mohanram A. 


Loader.
Live Chat Icon For mobile
Up arrow icon