Articles in this section
Category / Section

How to insert other controls inside a GridCell in Xamarin.Forms DataGrid?

1 min read

Currently SfDataGrid does not directly support editing of GridCells. However if your requirement is to edit the text of the GridCells during runtime, SfDataGrid allows you to achieve this by creating a TemplateColumn and loading an Entry cell into it using the DataTemplate property. The edited values are automatically committed since Entry cell has a default two way binding.

Refer the following code example to edit the text of GridCell in runtime.

<?xml version="1.0" encoding="utf-8" ?>

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"

                        xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"

                        xmlns:sfgrid="clr-namespace:Syncfusion.SfDataGrid.XForms;

                                                assembly=Syncfusion.SfDataGrid.XForms"

                        xmlns:local ="clr-namespace:Edit;assembly=Edit">

                      

  <ContentPage.BindingContext>

     <local:ViewModel x:Name="viewModel" />

  </ContentPage.BindingContext>

 

  <sfgrid:SfDataGrid x:Name="dataGrid"

                                  ColumnSizer="Star"

                                  ItemsSource="{Binding Info}">

 

     <sfgrid:SfDataGrid.Columns x:TypeArguments="sfgrid:Columns">

       

     <sfgrid:GridTextColumn MappingName="ID"/>

    

     //Creation of template column  

     <sfgrid:GridTemplateColumn MappingName="Name">

        <sfgrid:GridTemplateColumn.CellTemplate>

           <DataTemplate>

              <Entry x:Name="label" Text="{Binding Name}" TextColor="Black"

                          HorizontalOptions="Center" VerticalOptions="Center" />

           </DataTemplate>

        </sfgrid:GridTemplateColumn.CellTemplate>

     </sfgrid:GridTemplateColumn>

 

     <sfgrid:GridTextColumn MappingName="Percentage"/>

     <sfgrid:GridTextColumn MappingName="Result"/>

     <sfgrid:GridTextColumn MappingName="Remarks"/>

 

     </sfgrid:SfDataGrid.Columns>

   </sfgrid:SfDataGrid>

</ContentPage>

 

The following screenshots shows the final outcome when the above code is executed.

Table

You can download the working sample for this KB from the below link.

https://www.syncfusion.com/downloads/support/directtrac/general/ze/Editing-1248654463

Conclusion

I hope you enjoyed learning about how to insert other controls inside a GridCell in Xamarin.Android DataGrid.

You can refer to our Xamarin.Forms DataGrid feature tour page to know about its other groundbreaking feature representations. You can also explore our Xamarin.Forms Chart documentation to understand how to create and manipulate data.

For current customers, you can check out our components from the License and Downloads page. If you are new to Syncfusion, you can try our 30-day free trial to check out our other controls.

If you have any queries or require clarifications, please let us know in the comments section below. You can also contact us through our support forumsDirect-Trac, or feedback portal. We are always happy to assist you!


Did you find this information helpful?
Yes
No
Help us improve this page
Please provide feedback or comments
Comments (0)
Please sign in to leave a comment
Access denied
Access denied