How to update cell value in UWP Microsoft Toolkit DataGrid?

Question

i am trying to update the cell value from the datagrid but i dont know how to set the new celll value

    private async void GridViewAccount_CellEditEnded(object sender, 
    Microsoft.Toolkit.Uwp.UI.Controls.DataGridCellEditEndedEventArgs e)
    {
       using (SqlConnection con = new SqlConnection((App.Current as App).Connectionstring))
       {
           SqlCommand command = new SqlCommand("sp_updateaccount", con);
           command.CommandType = CommandType.StoredProcedure;
           command.Parameters.AddWithValue("@id", accountId);
           command.Parameters.AddWithValue("@username", null); //how to get the new cell value
           command.Parameters.AddWithValue("@password", null); //how to get the new cell value
           command.Parameters.AddWithValue("@phone", null); //how to get the new cell value
           command.Parameters.AddWithValue("@role", null); //how to get the new cell value
           await con.OpenAsync();
           await command.ExecuteNonQueryAsync();
           con.Close();
           accountToolRefresh();
       }
    }

Answer 1

First, you need to achieve a two-way binding. As follows:

Xaml code:

<controls:DataGrid     
      x:Name="MyDataGrid" 
      AutoGenerateColumns="False" 
      CellEditEnded="MyDataGrid_CellEditEnded"                                    
      ItemsSource="{x:Bind Users,Mode=TwoWay}">
         <controls:DataGrid.Columns>
           <controls:DataGridTextColumn Header="AccountId " Binding="{Binding Id,Mode=TwoWay}"/>
           <controls:DataGridTextColumn Header="UserName" Binding="{Binding UserName,Mode=TwoWay}"/>
           <controls:DataGridTextColumn Header="Password" Binding="{Binding Password,Mode=TwoWay}"/>
         </controls:DataGrid.Columns>
</controls:DataGrid>

Code behind:

public ObservableCollection<User> Users;
public MainPage()
{      
   this.InitializeComponent();
   Users=new ObservableCollection<User>
   {
      new User(){Id=1, UserName=”tom”, password=”123”},
      new User(){Id=2, UserName=”lily”, password=”563”}   
   }
           
 }     
       
public class User:INotifyPropertyChanged
{
        public event PropertyChangedEventHandler PropertyChanged;

        public int _id;
        public string _username;
        public string _password;
      
        public int Id 
        {
            get { return _id; }
            set {
                _id = value;
                RaisePropertyChanged("Id");
            }
        }
        public string UserName
        {
            get { return _username; }
            set
            {
                _username = value;
                RaisePropertyChanged("UserName");
            }
        }
        public string PassWord
        {
            get { return _password; }
            set
            {
                _password = value;
                RaisePropertyChanged("PassWord");
            }
        }
        
        public void RaisePropertyChanged(string propertyname = null) 
        {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyname));
        }
    }

When you change the cell value, the Users collection will be updated. Then in CellEditEnded event, you could get the DataContext of the current row and convert it to an object, so that you could get its properties via this object.

 private async void MyDataGrid_CellEditEnded(object sender, DataGridCellEditEndedEventArgs e)
{        
  User user=e.Row.DataContext as User;  
  …… 
  command.Parameters.AddWithValue("@id", user.accountId);
  command.Parameters.AddWithValue("@username", user.username);
  command.Parameters.AddWithValue("@password", user.password);     
}