How to edit a column in SfDataGrid?

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>

<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.

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

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

Did you find this information helpful?

Yes

Comments (0)

Please sign in to leave a comment