I have a Community Toolkit datagrid with a button. Clicking the button fires an event that calls a method that updates the Selected
property bound to the button's Text. The bound item is a property of the SelectedAssignUsersGrid
property bound to the data grid's SelectedItem
.
My goal is that the button's text will update in the data grid UI once the Selected
property changes programmatically. The problem is that it doesn't change when the property changes in most cases, but it is quirky. If I double-click the button, it sometimes changes, but doesn't always match the actual property value. Is the data grid hopelessly quirky, or is there a way to have the UI match the bound properties as they change?
XAML Datagrid:
<controls:DataGrid x:Name="dataGridAssignUsers_Temp"
Margin="12" GridLinesVisibility="All" HorizontalGridLinesBrush="PowderBlue" VerticalGridLinesBrush="PowderBlue"
BorderBrush="PowderBlue" ScrollViewer.HorizontalScrollBarVisibility="Auto"
AutoGenerateColumns="False"
SelectedItem="{x:Bind ViewModel.SelectedAssignUsersGrid, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
ItemsSource="{x:Bind ViewModel.AssignUsersGrid, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}">
<controls:DataGrid.Columns>
<controls:DataGridTemplateColumn Header="Select" Width="75">
<controls:DataGridTemplateColumn.CellTemplate>
<DataTemplate x:DataType="viewmodels:ProjectViewModel">
<Grid>
<Button Click="DataGridAssignUserSelect_Click" HorizontalContentAlignment="Left"
VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
<TextBlock>
<Run FontSize="12" Text="{Binding Selected,Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"/>
</TextBlock>
</Button>
</Grid>
</DataTemplate>
</controls:DataGridTemplateColumn.CellTemplate>
</controls:DataGridTemplateColumn>
<controls:DataGridTextColumn IsReadOnly="True"
Header="AD User Name"
Width="250"
Binding="{Binding UserAdazureAduserName}"
FontSize="14" />
<controls:DataGridTextColumn IsReadOnly="False"
Header="User Initials"
Width="250"
Binding="{Binding AppUserInitials}"
FontSize="14" />
</controls:DataGrid.Columns>
</controls:DataGrid>
Code Behind Event:
private void DataGridAssignUserSelect_Click(object sender, RoutedEventArgs e)
{
ViewModel.SelectAssignableUser();
dataGridAssignUsers.UpdateLayout();
}
ViewModel Code called from above event:
public partial class ProjectViewModel : ObservableObject, IDisposable
{
...
[ObservableProperty]
private ObservableCollection<TempUser> _assignUsersGrid; //Project users datagrid source.
[ObservableProperty]
public TempUser _selectedAssignUsersGrid = new(); //Item selected in the datagrid.
public void SelectAssignableUser()
{
if (SelectedAssignUsersGrid is null) return;
SelectedAssignUsersGrid.Selected = !SelectedAssignUsersGrid.Selected;
}
...
}
For reference, here is the underlying model class that the grid is bound to:
public class TempUser
{
public bool Selected { get; set; }
public string AppUserInitials { get; set; }
public string UserAdazureAduserName { get; set; }
public TempUser() { }
}