We Keep Coding

Telerik datagrid Refresh data: Button in view is working but event not

I struggle to refresh the data attached to the RADdatagrid. The view with the Datagrid shows the position of a team in a competition. Every time a new game is finished the view has to be updated automatically. The data is stored in a sqlite database and a simple sql query gets the positions from the database. A button in the view that calls the query method does the job but I want to update the grid directly after the finished game is stored. I implemented INotifyPropertyChanged but no result. I also tried to fire the button_click event but that also didn't bring me the result. I want to do this right but I am open to a quick and dirty solution. Here is a bit of my code:
<StackPanel Grid.Row="2" Orientation="Horizontal">
<TextBlock Grid.Row="2" Margin="40,0,0,5">Team Ranking</TextBlock>
<Button x:Name="RefreshViewButton" Command="{Binding Path=RefreshView}" Margin="40 0 0 0 " Click="RefreshViewButton_Click">Refresh</Button>
</StackPanel>
<StackPanel Grid.Row="6" Margin="0, 0, 50, 0" VerticalAlignment="Stretch">
<telerikGrid:RadDataGrid
AutoGenerateColumns="False"
x:Name="Datagrid"
BorderThickness="0"
ItemsSource="{x:Bind ViewModel.TeamResult, Mode=TwoWay}"
ColumnDataOperationsMode="Flyout"
GridLinesVisibility="None"
RelativePanel.AlignLeftWithPanel="True"
RelativePanel.AlignRightWithPanel="True"
UserEditMode="None" >
<telerikGrid:RadDataGrid.Columns>
<telerikGrid:DataGridNumericalColumn PropertyName="Rank" Header="Rank" SizeMode="Auto"/>
<telerikGrid:DataGridTextColumn PropertyName="Team_Naam" Header="TeamNaam" SizeMode="Auto"/>
<telerikGrid:DataGridTextColumn PropertyName="WedstrijdPunten" Header="WP" CanUserEdit="False" CanUserFilter="False" CanUserGroup="False" CanUserReorder="False" CanUserResize="False" CanUserSort="False" SizeMode="Auto" />
<telerikGrid:DataGridTextColumn PropertyName="PuntenVoor" Header="GP" SizeMode="Auto"/>
</telerikGrid:RadDataGrid.Columns>
</telerikGrid:RadDataGrid>
</StackPanel>
This is my view:
public sealed partial class TeamTotals : Page
{
public TeamResultsViewModel ViewModel { get; set; } = new TeamResultsViewModel();
public TeamTotals()
{
DataContext = ViewModel;
this.InitializeComponent();
}
public void RefreshViewButton_Click(object sender, RoutedEventArgs e)
{
ViewModel.LoadTeamResultsData();
}
}
My ViewModel:
public class TeamResultsViewModel : TeamModel
{
//public List<TeamModel> TeamResult = new List<TeamModel>();
public ObservableCollection<TeamModel> TeamResult = new ObservableCollection<TeamModel>();
TeamModel tm = new TeamModel();
public TeamResultsViewModel()
{
LoadTeamResultsData();
tm.PropertyChanged += Tm_PropertyChanged;
}
private void Tm_PropertyChanged(object sender, PropertyChangedEventArgs e)
{
throw new NotImplementedException();
}
public void LoadTeamResultsData()
{
int i = 0;
if(TeamResult != null)
{
TeamResult.Clear();
}
try
{
string sql = "Select Team_Naam, WedstrijdPunten, PuntenVoor, PuntenTegen FROM Team WHERE KlasseId = 1 " +
"ORDER BY WedstrijdPunten DESC, PuntenVoor DESC LIMIT 10;";
var resultaat = SqliteDataAccess.LoadData<TeamModel>(sql, new Dictionary<string, object>());
foreach (var x in resultaat)
{
TeamResult.Add(x);
x.Rank = i++;
}
}
catch (Exception ex)
{
var messagedialog2 = new MessageDialog($"{ex}");
_ = messagedialog2.ShowAsync();
}
return;
}
}
and the model:
public class TeamModel : INotifyPropertyChanged
{
private int _id;
public int Id
{
get { return _id; }
set { _id = value; }
}
private int _klasseId;
public int KlasseId
{
get { return _klasseId; }
set { _klasseId = value; }
}
private string _team_naam;
public string Team_Naam
{
get { return _team_naam; }
set { _team_naam = value; }
}
private int _coachId;
public int CoachId
{
get { return _coachId; }
set { _coachId = value; }
}
private int _clubId;
public int ClubId
{
get { return _clubId; }
set { _clubId = value; }
}
private int _puntenVoor;
public int PuntenVoor
{
get { return _puntenVoor; }
set { _puntenVoor = value; }
}
private int _puntenTegen;
public int PuntenTegen
{
get { return _puntenTegen; }
set { _puntenTegen = value; }
}
private int _wedstrijdPunten;
public int WedstrijdPunten
{
get { return _wedstrijdPunten; }
set
{
_wedstrijdPunten = value;
OnPropertyChanged("WedstrijdPunten");
}
}
private int _rank;
public int Rank
{
get { return _rank; }
set { _rank = value; }
}
public List<SpelerModel> TeamLeden { get; set; } = new List<SpelerModel>();
public string Standen => $"{Team_Naam} : {PuntenVoor}";
public event PropertyChangedEventHandler PropertyChanged;
protected virtual void OnPropertyChanged(string propertyName)
{
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}
public override string ToString()
{
return Standen;
}
}

WPF databinding and refreshing its UI

I've posted the same question before but it wasn't clear (and contained too many self-induced errors in attempt to fix the code) so re-posting it with more details.
So I have "MainUiWindow.xaml" file which uses databinding like this:
<ItemsControl x:Name="gridSettingsMonster" Grid.Row="0" Grid.Column="0" ItemsSource="{Binding SettingsMonster}">
<ItemsControl.ItemTemplate>
<DataTemplate DataType="{x:Type core:Setting}">
<Grid x:Name="gridMonster">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="auto"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<TextBlock Grid.Row="0" Grid.Column="0" Text="{Binding Label}" IsEnabled="{Binding Enabled}" ToolTip="{Binding Description}" HorizontalAlignment="Left" VerticalAlignment="Center" Margin="10 5 10 5" FontWeight="{Binding Fontweight}" ></TextBlock>
<ts:ToggleSwitch x:Name="toggleSwitchMonsterAll" IsEnabled="{Binding Enabled}" Grid.Row="0" Grid.Column="1" Command ="{Binding TriggerAction}" IsChecked="{Binding Value}" HorizontalAlignment="Right" VerticalAlignment="Center" Margin="5 0 20 2" Foreground="White" UncheckedText="" CheckedText="" UncheckedBorderBrush="#FF333333" CheckedBorderBrush="#FF2D2D30"/>
</Grid>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
SettingsMonster binding:
SettingsMonster.Add(new Setting(ConfigHelper.Main.Values.Overlay.MonsterWidget.IsVisible, true, "Monster_1", "Monster Widget", "Show/Hide Monsters Widget", new Command(_ =>
{
ConfigHelper.Main.Values.Overlay.MonsterWidget.IsVisible = !ConfigHelper.Main.Values.Overlay.MonsterWidget.IsVisible;
ConfigHelper.Main.Save();
})));
SettingsMonster.Add(new Setting(ConfigHelper.Main.Values.Overlay.MonsterWidget.ShowUnchangedMonsters, ConfigHelper.Main.Values.Overlay.MonsterWidget.IsVisible, "Monster_2", " Show unchanged monsters", "Automatically hide monsters if they are not damaged", new Command(_ =>
{
ConfigHelper.Main.Values.Overlay.MonsterWidget.ShowUnchangedMonsters = !ConfigHelper.Main.Values.Overlay.MonsterWidget.ShowUnchangedMonsters;
ConfigHelper.Main.Save();
})));
And finally, the Setting class:
public class Setting
{
public bool Value { get; set; }
public bool Enabled { get; set; }
public string Name { get; }
public string Label { get; }
public string Description { get; }
public string Checkbox_visibility { get; }
public string Fontweight { get; }
public List<Setting>SubSettings { get; }
public Command TriggerAction { get; }
public Setting(bool value, bool enabled, string name, string label, string description, Command action = null)
{
Value = value;
Enabled = enabled;
Name = name;
Label = label;
Description = description;
SubSettings = new List<Setting>();
TriggerAction = action;
}
}
Problem:
When I run the build and use the "ToggleSwitch" (it's basically a open-source checkbox) to change the value of "ConfigHelper.Main.Values.Overlay.MonsterWidget.IsVisible", it unchecks the UI correctly.
I want this checkbox to control the other checkboxes (i.e. "Monster_2") as well, so that when the main one is turned off, set IsEnabled value for the child checkboxes/textblocks to FALSE.
I got to the stage where if I check off the main one, restart the build, then the child checkboxes/textblocks are all set as IsEnabled=False. However, I want the same to happen in real time (i.e. refresh the UI without having to restart).
Any help would be appreciated.
EDIT 1.
So I have attempted implementing the INotifyPropertyChanged in my Settings class which looks like the following:
public class Setting : INotifyPropertyChanged
{
public event PropertyChangedEventHandler PropertyChanged;
private bool _value;
private bool _enabled;
public bool Value
{
get
{
return _value;
}
set
{
if (_value == value)
return;
_value = value;
OnPropertyChanged(nameof(Enabled));
}
}
public bool Enabled
{
get
{
return _enabled;
}
set
{
if (_enabled == value)
return;
_enabled = value;
OnPropertyChanged(nameof(Enabled));
}
}
protected void OnPropertyChanged(string name)
{
if (PropertyChanged != null)
{
PropertyChanged(this, new PropertyChangedEventArgs(name));
}
}
public string Name { get; }
public string Label { get; }
public string Description { get; }
public string Checkbox_visibility { get; }
public string Fontweight { get; }
public List<Setting>SubSettings { get; }
public Command TriggerAction { get; }
public Setting(bool value, bool enabled, string name, string label, string description, Command action = null)
{
Value = value;
Enabled = enabled;
Name = name;
Label = label;
Description = description;
SubSettings = new List<Setting>();
TriggerAction = action;
}
But my UI is still not refreshing yet... any help?

My viewmodel was referencing incorrect variable in the first place.
I have implemented INotifyPropertyChange in my Setting object as below, and also added a command to be run when the checkbox is triggered.
public class Setting : INotifyPropertyChanged
{
public event PropertyChangedEventHandler PropertyChanged;
protected void OnPropertyChanged(string name)
{
if (PropertyChanged != null)
{
PropertyChanged(this, new PropertyChangedEventArgs(name));
}
}
private bool _value;
private bool _enabled;
public bool Value
{
get
{
return _value;
}
set
{
if (_value == value)
return;
_value = value;
OnPropertyChanged(nameof(Value));
}
}
public bool Enabled
{
get
{
return _enabled;
}
set
{
if (_enabled == value)
return;
_enabled = value;
OnPropertyChanged(nameof(Enabled));
}
}
public string Name { get; }
public string Label { get; }
public string Description { get; }
public string Fontweight { get; }
public List<Setting>SubSettings { get; }
public Command TriggerAction { get; }
public Setting(bool _value, bool _enabled, string name, string label, string description, Command action = null)
{
Value = _value;
Enabled = _enabled;
Name = name;
Label = label;
Description = description;
SubSettings = new List<Setting>();
TriggerAction = action;
}
}

Refresh WPF label

I'm trying to dynamically refresh the label that shows the current amount of space remaining but unfortunately the number doesn't refresh. Do you have any idea how to solve my problem?
C#
private void ReqDescText_Changed(object sender, TextChangedEventArgs e)
{
Counter ReqDescText_Counter = new Counter(ReqDescText, ReqDescLabelLength);
}
Class
public class Counter
{
public TextBox InputTextbox { get; set; }
public Label CounterLabel { get; set; }
public Counter(TextBox InputTextbox, Label CounterLabel)
{
int NB;
TextBox textBox = new TextBox();
var tempText = textBox.Text;
NB = (InputTextbox.MaxLength - tempText.Length);
CounterNumber counterNumber = new CounterNumber { Number = NB.ToString() };
CounterLabel.Content = counterNumber;
if (NB == 0)
{
CounterLabel.Foreground = new SolidColorBrush(Colors.Red);
}
}
class CounterNumber
{
public string Number { get; set; }
public override string ToString()
{
return "[" + Number + "]";
}
}
}
WPF
<Label x:Name ="ReqDescLabel" Content="Description" Grid.Row="1" Margin="5,5,0,5" Grid.Column="0"/>
<Label Name="ReqDescLabelLength" FontSize="10" Grid.Row="1" Grid.Column="1" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="0,6"/>
<TextBox x:Name ="ReqDescText" Padding="3" Grid.Row="1" Margin="0,5,0,5" Grid.Column="2" TextWrapping="Wrap" SpellCheck.IsEnabled="True" MaxLength="250" TextChanged="ReqDescText_Changed" ScrollViewer.VerticalScrollBarVisibility="Auto" ScrollViewer.CanContentScroll="True"/>
How it's looks like

Problem solved. My mistake.
I did't take the current length of the text.
public class Counter
{
public TextBox InputTextbox { get; set; }
public Label CounterLabel { get; set; }
public Counter(TextBox InputTextbox, Label CounterLabel)
{
int NB;
var tempText = InputTextbox.Text;
NB = (InputTextbox.MaxLength - tempText.Length);
CounterNumber counterNumber = new CounterNumber { Number = NB.ToString() };
CounterLabel.Content = counterNumber;
if (NB == 0)
{
CounterLabel.Foreground = new SolidColorBrush(Colors.Red);
}
}
class CounterNumber
{
public string Number { get; set; }
public override string ToString()
{
return "[" + Number + "]";
}
}
}

Bind DataTemplate to a unique variable

I'm trying to create multiple sliders but each slider only changes the last object to be created
XML
<DataTemplate x:Key = "processTemplate">
<StackPanel Orientation = "Horizontal">
<TextBlock Text = "{Binding Path = Name, Mode = TwoWay}" Width = "100" Margin = "3 5 3 5"/>
<TextBlock Text = "{Binding Path = ID, Mode = TwoWay}" Width = "100" Margin = "0 5 3 5"/>
<Slider Value="{Binding Path = Volume, Mode = TwoWay}" Maximum="100" Width="100"/>
</StackPanel>
</DataTemplate>
CLASS
public class ProcessList
{
private string name;
public string Name { get; set; }
private int id;
public int ID { get; set; }
private float volume;
public float Volume {
get { return volume; }
set {
if (volume != value) {
volume = value;
SetApplicationVolume(this.id, volume);
MessageBox.Show(this.id.ToString());
}
}
}
}
and how it's populated
processes.Add(new ProcessList() { Name = theprocess.ProcessName, ID = theprocess.Id, Volume = VolumeMixer.GetApplicationVolume(theprocess.Id)});
How can I change it so each slider changes the volume of its process
If anyone is as stupid as me here is the corrected code:
private string name = "";
public string Name {
get {
return name;
}
set {
if (name != value) {
name = value;
NotifyPropertyChanged("Name");
}
}
}
private int id = 0;
public int ID {
get {
return id;
}
set {
if (id != value) {
id = value;
NotifyPropertyChanged("ID");
}
}
}

The ID property is not synchronized with its backing field id, and id is always the same 0.
Also, you should pass ID and Volume through the constructor, because your code rely on the assumption that one would always assign Volume after the ID.

How to bind Selected Items in MVVM

I am using WPF, MVVM and DevExpress GridControl. There are two panels in my MainWindow.xaml. Panle1 has Grid and Panel2 has Textbox. I want that if i select an item from Grid in Panel1 it's name should display in that Panle2 Textbox. Iwrote Code but it is not working. Can you Please help me to solve this?
*In NameModel From Models Folder I wrote:*
private NameModelClass _selectedCustomer;
public NameModelClass SelectedCustomer
{
get { return _selectedCustomer; }
set
{
if (_selectedCustomer != value)
{
_selectedCustomer = value;
LastName = value.LastName;
OnPropertyChanged("SelectedCustomer");
}
}
public List<Namess> ListPerson { get; set; }
void CreateList()
{
ListPerson = new List<Namess>();
for (int i = 0; i < 10; i++)
{
ListPerson.Add(new Namess(i));
}
}
public class Namess
{
public Namess(int i)
{
FirstName = "FirstName" + i;
LastName = "LastName" + i;
Age = i * 10;
}
public string FirstName { get; set; }
public string LastName { get; set; }
public int Age { get; set; }
}
}
In MianWindow.xaml I wrote:
<dxdo:LayoutPanel Caption="Grid" Caption="Panel1" x:Name="abc1">
<Grid>
<dxg:GridControl x:Name="grid" Height="233" ItemsSource="{Binding ListPerson}" AutoGenerateColumns="AddNew" HorizontalAlignment="Left" VerticalAlignment="Top" SelectedItem="{Binding SelectedNames}">
<dxg:GridControl.View>
<dxg:TableView ShowTotalSummary="True"/>
</dxg:GridControl.View>
</dxg:GridControl>
</Grid>
</dxdo:LayoutPanel>
<dxdo:LayoutPanel Caption="Panel2" x:Name="abc1">
<TextBox Width="166" Background="White" Height="33" HorizontalAlignment="Right" VerticalAlignment="Bottom" Text="{Binding Path=LastName}"/>
</dxdo:LayoutPanel>
I am new to MVVM and c#. I f my query is not clear to you please ask me. Thank you.

I do it this way:
private Namess _selectedCustomer;
public Namess SelectedCustomer
{
get { return _selectedCustomer; }
set
{
if (_selectedCustomer != value)
{
_selectedCustomer = value;
OnPropertyChanged("SelectedCustomer");
}
}
public List<Namess> ListPerson { get; set; }
void CreateList()
{
ListPerson = new List<Namess>();
for (int i = 0; i < 10; i++)
{
ListPerson.Add(new Namess(i));
}
}
public class Namess : INotifyPropertyChanged
{
public event PropertyChangedEventHandler PropertyChanged;
protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
{
PropertyChangedEventHandler handler = PropertyChanged;
if (handler != null)
handler(this, new PropertyChangedEventArgs(propertyName));
}
public Namess(int i)
{
FirstName = "FirstName" + i;
LastName = "LastName" + i;
Age = i * 10;
}
public string FirstName { get; set; }
private string _lastName;
public string LastName
{
get
{
return _lastName;
}
set
{
if(value==_lastName)
return;
_lastName=value;
OnPropertyChanged("LastName");
}
}
public int Age { get; set; }
}
}
and in your view:
<dxdo:LayoutPanel Caption="Grid" Caption="Panel1" x:Name="abc1">
<Grid>
<dxg:GridControl x:Name="grid" Height="233" ItemsSource="{Binding ListPerson}" AutoGenerateColumns="AddNew" HorizontalAlignment="Left" VerticalAlignment="Top" SelectedItem="{Binding SelectedNames,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}">
<dxg:GridControl.View>
<dxg:TableView ShowTotalSummary="True"/>
</dxg:GridControl.View>
</dxg:GridControl>
</Grid>
</dxdo:LayoutPanel>
<dxdo:LayoutPanel Caption="Panel2" x:Name="abc1">
<TextBox Width="166" Background="White" Height="33" HorizontalAlignment="Right" VerticalAlignment="Bottom" Text="{Binding Path=SelectedCustomer.LastName,Mode=OneWay,UpdateSourceTrigger=PropertyChanged}"/>
</dxdo:LayoutPanel>
Bsically I changed the type of SelectedCustomer to one of the collection of items. In the view you can set the binding of your TextBox directly to a property of the SelectedCustomer.

It looks like you forgot to raise the INPC (INotifyPropertyChanged) event for the "LastName" string.
So try this (changed is in the setter below):
public NameModelClass SelectedCustomer
{
get { return _selectedCustomer; }
set
{
if (_selectedCustomer != value)
{
_selectedCustomer = value;
LastName = value.LastName;
OnPropertyChanged("SelectedCustomer");
OnPropertyChanged("LastName"); //<-- new
}
}
}
You have to send out INPCs so that the binding knows to update to the new value. The displayed binding won't "grab" the new value for LastName unles you raise that event.

Have you tried:
SelectedItem="{Binding SelectedNames, Mode=TwoWay}"
After looking at it more, your main Namess Class could do with implementing INotifyPropertyChanged
With each property raising the property changed event when it ahem changes.
Also using an observable collection so when you add and remove items it also raises changes.
That way, the notification change system receives the notify of property changes to change the view accordingly via bindings.