Mvvm - Cancel changes in Wpf Listbox, vb.net - wpf

I have a wpv/mvvm-light/vb.net application with a master/detail view. In this view there is a listbox of clients and a detail view of the client's details where they user can view and edit the customers.
I wanted to add a function where users would be prompted to save changes when a new client is selected in the listbox. If the user chooses yes from the messagebox then save changes and if no then discard changes and return previous selected item back to its original value. I have this all working fine.
My problem is that when the user selects a new client and the messagebox asks them to save changes, the listbox goes out of sync. Meaning that the listbox shows the new client selected but the detail view still shows the previous client. The odd thing is that it works properly on rare occasions.
The following is my view:
<UserControl x:Class="FTC.View.ClientListView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="clr-namespace:FTC_Application"
mc:Ignorable="d"
d:DesignHeight="400" d:DesignWidth="900">
<ListBox
Grid.Column="1"
Width="350"
Style="{DynamicResource FTC_ListBox}"
ItemTemplate="{DynamicResource FTC_ClientListTemplate}"
ItemContainerStyle="{DynamicResource FTC_ListItem}"
ItemsSource="{Binding ClientViewSource.View}"
SelectedItem="{Binding Path=Selection, Mode=TwoWay}"
/>
<ContentControl DataContext="{Binding Path=Selection, Mode=TwoWay}" >
<!--all the display stuff goes here for the detail view-->
</ContentControl>
</UserControl>
the following is the property in the viewmodel that the selecteditem of the listbox is bound to. It is also the binding for the content control that displays the details.
Public Property Selection As client
Get
Return Me._Selection
End Get
Set(ByVal value As client)
''capture current value of selection
_PreviousClient = _Selection
''If they are the same,
If value Is _PreviousClient Then
Return
End If
' Note that we actually change the value for now.This is necessary because WPF seems to query the
' value after the change. The list box likes to know that the value did change.
If Me._Selection.HasChanges = True And _Selection.HasErrors = False Then
'If HasChangesPrompt(value) = True Then
' ''user rejects saving changes, exit property
' Return
'End If
If FTCMessageBox.Show("Do you want to save your changes", "Unsaved Changes", MessageBoxButton.YesNo, MessageBoxImage.Warning) = MessageBoxResult.No Then
''SELECTION IS CANCELLED
' change the value back, but do so after the UI has finished it's current context operation.
Application.Current.Dispatcher.BeginInvoke(New Action(Sub()
'' revert the current selected item to its original values and reset its HasCHanges tracking
objHelper.CopyProperties(_OriginalClient, _Selection)
_Selection.HasChanges = False
RaisePropertyChanged(ClientSelectedPropertyName)
''continue with listbox selection changing to the new value for selection
_ClientCollectionViewSource.View.MoveCurrentTo(value)
End Sub), DispatcherPriority.Normal, Nothing)
Return
Else
''save changes to database
SaveExecute()
End If
End If
_Selection = value
_Selection.HasChanges = False
RaisePropertyChanged(ClientSelectedPropertyName)
''clone the unchanged version of the current selected client on na original variable
objHelper.CopyProperties(_Selection, _OriginalClient)
End Set
End Property
SO the idea is that if the user does not want to save changes, an original value of the client is copied (using reflection) over the current value, then the ui is updated and the selection continues on to the new value chosen by the user. However, like I said above, the listbox does not reflect this change even though I tired to hard code it with the following line:
''continue with listbox selection changing to the new value for selection
_ClientCollectionViewSource.View.MoveCurrentTo(value)
I got this solution by working customizing the solution posted HERE
can anyone help me figure out why my listbox goes out of sync when this happens.
Thanks in advance

First:
I can't find the real Problem in your solution, but you have definitly - and I repeat - definitly too much code and logic in your Property Setter. Try move it to other methods and validate your implementation of those many ´if else´ blocks.
Second:
The Setter gets only fired when you select a new Item in your Listbox, but you Raise a Property changes for ´ClientSelectedPropertyName´ and not for ´Selection´ as its supposed to be. Move the property changed alsways to the end of your setter.
Try this. I hope it helps :)

So I have a working example that I think follows the MVVM-Light standard. There is a lot going on so I will try to keep it short and precise.
I ended up using EventToCommand bound to the SelectionChanged event with a ListView(instead of listbox). The EventToCommand required new namespace references as is shown below. I then bound the EventToCommand to a RelayCommand in the view model which in turn calls a private sub that handles the client validation and saves/cancels/ and updates the listview seleceditem as required.
For further information, I have a navigation service that is used to navigat between views in my wpf application. I used the MVVM-Light messanger to send a navigationstarting message that is "recieved" by this view model. Then the same client validation functions are performed and naviagtion is canceled/allowed based on user response to the dialog message thrown. I will no include all of hte navigation code unless requested. The following is the code needed to solve my original question.
<UserControl x:Class="FTC.View.ClientListView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="clr-namespace:FTC_Application"
xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
xmlns:cmd="http://www.galasoft.ch/mvvmlight"
mc:Ignorable="d"
d:DesignHeight="400" d:DesignWidth="900">
<ListView
Grid.Column="1"
Width="350"
Style="{DynamicResource FTC_ListView}"
ItemTemplate="{DynamicResource FTC_ClientListTemplate}"
ItemContainerStyle="{DynamicResource FTC_ListViewItem}"
ItemsSource="{Binding ClientViewSource.View}"
SelectedItem="{Binding Path=Selection, Mode=TwoWay}">
<i:Interaction.Triggers>
<i:EventTrigger EventName="SelectionChanged">
<cmd:EventToCommand Command="{Binding SelectedItemChangedCommand}"/>
</i:EventTrigger>
</i:Interaction.Triggers>
</ListView>
<ContentControl DataContext="{Binding Path=Selection, Mode=TwoWay}" >
<!-- Display stuff and bound controls go here -->
</ContentControl>
</Grid>
</UserControl>
Then the following is the relevant code (I removed as much code as possible to keep it clear) in my view model:
Imports System.Data
Imports System.ComponentModel
Imports System.Collections.ObjectModel
Imports System.Windows.Threading
Imports GalaSoft.MvvmLight
Imports GalaSoft.MvvmLight.Command
Imports GalaSoft.MvvmLight.Messaging
Imports FTCModel
Imports FTC_Application.FTC.Model
Imports FTC_Application.FTC.View
Imports FTC_Application.FTC.ViewModel
Imports FTC_Application.FTC.MessageBox
Imports FTC_Application.FTC.Helpers
Imports FTC_Application.FTC.MessengerHelper
Namespace FTC.ViewModel
Public Class ClientListViewModel
Inherits ViewModelBase
Implements IDataErrorInfo
#Region "DECLARATIONS"
Public Const ClientCollectionPropertyName As String = "ClientCollection"
Public Const ClientSelectedPropertyName As String = "Selection"
Public Const ClientDetailCollectionPropertyName As String = "ClientDetailCollection"
Public Const ClientPropertyName As String = "Client"
''gets the data from LINQ to ENT Model
Private _Clients As New ObservableCollection(Of client)
''creats holder for the selected item two way binding
Private _Selection As New client
''the following is used to track changes for unding and canceling selection changed
Private _PreviousClient As New client
Private _PreviousOriginalClient As New client
Private _OriginalClient As New client
''Recieves observable collection and provicdes sorting and filtering function
Private _ClientCollectionViewSource As New CollectionViewSource
''RELAY COMMANDS declarations
Private _SaveCommand As RelayCommand
Private _SelectedItemChangedCommand As RelayCommand
''gets the VML for getting the data service
Private vml As ViewModelLocator = TryCast(Application.Current.Resources("Locator"), ViewModelLocator)
''this is a holder for the client data service
Private _ClientAccess As IClientDataService = vml.Client_Service
'' has functions using reflection for copying objects
Dim objHelper As New ObjectHelper
''tracks if client validation is coming from navigation or listview selecteditemchanged
Private bNavigatingFlag As Boolean = False
#End Region
#Region "PROPERTIES"
Public ReadOnly Property ClientViewSource As CollectionViewSource
Get
Return Me._ClientCollectionViewSource
End Get
End Property
Private Property Clients As ObservableCollection(Of client)
Get
Return Me._Clients
End Get
Set(ByVal value As ObservableCollection(Of client))
Me._Clients = value
_Clients = value
RaisePropertyChanged(ClientCollectionPropertyName)
End Set
End Property
Public Property Selection As client
Get
Return Me._Selection
End Get
Set(ByVal value As client)
''capture current value of selection
_PreviousClient = _Selection
objHelper.CopyProperties(_OriginalClient, _PreviousOriginalClient)
''If they are the same,
If value Is _PreviousClient Then
Return
End If
_Selection = value
_Selection.HasChanges = False
RaisePropertyChanged(ClientSelectedPropertyName)
''clone the unchanged version of the current selected client on na original variable
objHelper.CopyProperties(_Selection, _OriginalClient)
End Set
End Property
#End Region
#Region "COMMANDS"
Public ReadOnly Property SelectedItemChangedCommand() As RelayCommand
Get
If _SelectedItemChangedCommand Is Nothing Then
_SelectedItemChangedCommand = New RelayCommand(AddressOf SelectionChangedValidate)
End If
Return _SelectedItemChangedCommand
End Get
End Property
#End Region
#Region "METHODS"
Private Sub SelectionChangedValidate()
''Uses falg to tell if validation request triggered by navigation event or listview selecteditemchanged event
''use previous client for listview event and current client for navigating event
Dim _ClientToValidate As client
If bNavigatingFlag = True Then
_ClientToValidate = _Selection
Else
_ClientToValidate = _PreviousClient
End If
If _ClientToValidate.HasChanges = True And _ClientToValidate.HasErrors = False Then
Dim message = New DialogMessage(_ClientToValidate.chrCompany.ToString + " has been changed." + vbCrLf + "Do you want to save your changes?", AddressOf SavePreviousResponse) With { _
.Button = MessageBoxButton.YesNo, _
.Caption = "Unsaved Changes" _
}
Messenger.[Default].Send(message)
Exit Sub
End If
If _ClientToValidate.HasErrors = True Then
Dim message = New DialogMessage(_ClientToValidate.chrCompany.ToString + " has errors." + vbCrLf + "You must correct these errors before you can continue.", AddressOf HasErrorsResponse) With { _
.Button = MessageBoxButton.OK, _
.Caption = "Validation Error" _
}
Messenger.[Default].Send(message)
Exit Sub
End If
''reset the navigation flag
bNavigatingFlag = False
End Sub
Private Sub SavePreviousResponse(result As MessageBoxResult)
If result = MessageBoxResult.No Then
objHelper.CopyProperties(_PreviousOriginalClient, _PreviousClient)
_PreviousClient.HasChanges = False
Else
''user wants to save changes, save changes to database
SaveExecute()
End If
End Sub
Private Sub HasErrorsResponse(result As MessageBoxResult)
Selection = _PreviousClient
''_ClientCollectionViewSource.View.MoveCurrentTo(_PreviousClient)
End Sub
Private Function HasChangesPrompt(value As client) As Boolean
If FTCMessageBox.Show("Do you want to save your changes", "Unsaved Changes", MessageBoxButton.YesNo, MessageBoxImage.Warning) = MessageBoxResult.No Then
'' change the selected client back to its original value, but do so after the UI has finished its current context operation.
Application.Current.Dispatcher.BeginInvoke(New Action(Sub()
'' revert the current selected item to its original values and reset its HasCHanges tracking
objHelper.CopyProperties(_OriginalClient, _Selection)
_Selection.HasChanges = False
RaisePropertyChanged(ClientSelectedPropertyName)
''continue with listbox selection changing to the new value for selection
_ClientCollectionViewSource.View.MoveCurrentTo(value)
End Sub), DispatcherPriority.Normal, Nothing)
Return True
Else
''user wants to save changes, save changes to database
Return False
SaveExecute()
End If
End Function
#End Region
Public Sub New()
Clients = _ClientAccess.GetClient_All
''Sets the observable collection as the source of the CollectionViewSource
_ClientCollectionViewSource.Source = Clients
If Selection.idClient = 0 Then
Selection = Clients.Item(0)
End If
''register for messages
Messenger.[Default].Register(Of String)(Me, AddressOf HandleMessage)
End Sub
End Class
End Namespace
INXS, you will notice that the selection property setter has way less code/logic. Also, I think each part of the view model is testable and there is no direct coupling between my view and viewmodel. But this is my first WPF/MVVM application so I sitll don't fully grasp all the concepts.
I hope that this can help someone as it took my quite a while to figure it out.

Related

WPF Can I use a DataTrigger to have the View do something after the View Model changes the value of a Property?

My WPF MVVM VB.NET app loads a list of songs into a ListBox at start. The list contents populate in a BackgroundWorker that is kicked off in the Constructor of the ViewModel. Once this is done, I want to set focus to the first song in the list.
As setting this focus is purely a View operation, I want it in the code-behind of the XAML. It's no business of the ViewModel where focus goes.
I tried doing this on various Window and ListBox events, but they either don't fire, or fire too early. So I'm think what I need is a Boolean Property that the ViewModel sets when it's done loading the songs into the list. That's when I need the View to catch that Property Change, and call the code-behind function that has the logic to maniuplate the View, in the is case, setting focus on the first song in the list.
But this is where my knowledge of WPF is short. I searched and it sounds like DataTrigger could do the trick. But where to put it, and what's the right syntax, and how to have it call my code-behind function?
Or is there an even simpler way that I'm overlooking. This seems like a basic functionality - to trigger some code-behind action in the View when a Property changes a certain way in the ViewModel.
Here's the code-behind function. I can elaborate it once it's successfully getting called at the intended time:
Private Sub FocusSongsList()
' set focus back to the Songs list, selected item (couldn't just set focus to the list, it ran forever and looks like it set focus to every item in turn before releasing the UI)
Dim listBoxItem = CType(LstSongs.ItemContainerGenerator.ContainerFromItem(LstSongs.SelectedItem), ListBoxItem)
If Not listBoxItem Is Nothing Then
listBoxItem.Focus()
End If
End Sub
Here's my ListBox:
<ListBox x:Name="LstSongs" ItemsSource="{Binding FilteredSongs}" DisplayMemberPath="Path"
HorizontalAlignment="Stretch"
SelectionMode="Extended" SelectionChanged="LstSongs_SelectionChanged" Loaded="FocusSongsList"/>
And I would define a new property that can be set from the RunWorkerCompleted part of the BackgroundWorker.
Private _InitialSongLoadCompleted As Boolean
Public Property InitialSongLoadCompleted() As Boolean
Get
Return _InitialSongLoadCompleted
End Get
Set(ByVal value As Boolean)
_InitialSongLoadCompleted = value
RaisePropertyChanged("InitialSongLoadCompleted")
End Set
End Property
A DataTrigger can't execute methods. It can only set properties.
Focus can't be activated by setting a property, therefore a DataTrigger can't solve your problem.
Generally, if you have longrunning initialization routines you should move them to an init routine (which could be async) or use Lazy<T>.
For example, you instantiate your view model class and call Initialize() afterwards. After the method has returned you can continue to initialize the ListBox:
MainWindow.xaml.cs
Partial Class MainWindow
Inherits Window
Private ReadOnly Property MainViewModel As MainViewModel
Public Sub New(ByVal dataContext As TestViewModel, ByVal navigator As INavigator)
InitializeComponent()
Me.MinViewModel = New MainViewMdel()
Me.DataContext = Me.MainViewModel
AddHandler Me.Loaded, AddressOf OnLoaded
End Sub
' Use the Loaded event to call async methods outside the constructor
Private Async Sub OnLoaded(ByVal sender As Object, ByVal e As EventArgs)
Await mainViewModel.InitializeAsync()
' For example handle initial focus
InitializeListBox()
End Sub
End Class
MainViewModel.cs
Class MainViewModel
Inherits INotifyPropertyChanged
Public Async Function InitializeAsync() As Task
Await Task.Run(AddressOf InitializeSongList)
End Function
Private Sub InitializeSongList()
' TODO::Initialize song list
End Sub
End Class
It has been a long long time since I wrote much VB, so I'm afraid this is c# code.
You can handle targetupdated on a binding.
This fires when data transfers from the source ( viewmodel property ) to the target (the ui property and here itemssource)
<ListBox
x:Name="LstSongs"
ItemsSource="{Binding Songs, NotifyOnTargetUpdated=True}"
TargetUpdated="ListBox_TargetUpdated"/>
When you replace your list, that targetupdated will fire.
If you raise property changed then the data will transfer ( obviously ).
private async void ListBox_TargetUpdated(object sender, DataTransferEventArgs e)
{
await Task.Delay(200);
var firstItem = (ListBoxItem)LstSongs.ItemContainerGenerator
.ContainerFromItem(LstSongs.Items[0]);
firstItem.Focus();
Keyboard.Focus(firstItem);
}
As that data transfers, there will initially be no items at all of course so we need a bit of a delay. Hence that Task.Delay which will wait 200ms and should let the UI render. You could make that a bit longer or dispatcher.invokeasync.
It finds the first container and sets focus plus keyboard focus.
It might not be at all obvious that item has focus.
A more elegant approach using dispatcher will effectively schedule this focussing until after the ui has rendered. It might, however, look rather tricky to someone unfamiliar with c#
private void ListBox_TargetUpdated(object sender, DataTransferEventArgs e)
{
Dispatcher.CurrentDispatcher.InvokeAsync(new Action(() =>
{
var firstItem = (ListBoxItem)LstSongs.ItemContainerGenerator
.ContainerFromItem(LstSongs.Items[0]);
firstItem.Focus();
Keyboard.Focus(firstItem);
}), DispatcherPriority.ContextIdle);
}
If you want a blue background then you could select the item.
firstItem.IsSelected = true;
Or you could use some datatrigger and styling working with IsFocused.
https://learn.microsoft.com/en-us/dotnet/api/system.windows.uielement.isfocused?view=windowsdesktop-7.0
( Always distracts me that, one s rather than two and IsFocussed. That'll be US english I gues )
Here's my mainwindowviewmodel
public partial class MainWindowViewModel : ObservableObject
{
[ObservableProperty]
private List<string> songs = new List<string>();
MainWindowViewModel()
{
Task.Run(() => { SetupSongs(); });
}
private async Task SetupSongs()
{
await Task.Delay(1000);
Songs = new List<string> { "AAA", "BBB", "CCC" };
}
}
I'm using the comunity toolkit mvvm for code generation. Maybe it does vb as well as c#.
You might accomplish your goal by defining a custom event in the viewmodel which is raised when the list processing is complete. The view can subscribe to it and act accordingly.
It would look something like this:
Class MyViewModel
'Custom eventargs shown for completeness, you can use EventHandler if you
'don't need any custom eventargs.
Public Event ListCompleted As EventHandler(Of ListCompletedEventArgs)
'...
Public Sub ProcessSongList()
'Note that if this runs on a background thread, you may need to
'get back on the UI thread to raise an event for the view to handle
RaiseEvent ListCompleted(Me, New ListCompletedEventArgs())
End Sub
End Class
Class MyView
Public Sub New(ByVal vm as MyViewModel)
Me.DataContext = vm
AddHandler vm.ListCompleted, AddressOf OnListCompleted
End Sub
Private Sub OnListCompleted(ByVal sender As Object, ByVal args As ListCompletedEventArgs)
'...
End Sub
'...
End Class
You mentioned doing processing on a background thread. I'm not completely sure which thread the completion event would issue into, but beware that UI stuff can only happen on the UI thread so you might need to use a Dispatcher.Invoke to make sure your code runs on the right thread. I'd do it to run the RaiseEvent so the view doesn't need to know anything about it.

WPF INotifyErrorInfo Validation.Error Event Not Raising

I'm encountering a strange problem. Despite setting everything correctly, the Validation.Error doesn't get fired.
Here are the details:
<DataTemplate x:Key="dtLateComers">
<TextBox Text="{Binding ParticipantTag, UpdateSourceTrigger=PropertyChanged, ValidatesOnDataErrors=True, NotifyOnValidationError=True, NotifyOnSourceUpdated=True}" Validation.Error="Validation_Error" >
</DataTemplate>
Code behind (VB.Net) to set ItemsSource of HeaderedItemsControl:
hicLateComers.ItemsSource = _LateComersViewModels
_LateComersViewModels is ObservableCollection(Of ParticipantViewModel)
Implementation of ParticipantViewMode:
Public Class ParticipantViewModel
Implements INotifyPropertyChanged, IDataErrorInfo
Private _ParticipantTag As String = ""
Public Property ParticipantTag() As String
Get
Return _ParticipantTag
End Get
Set(ByVal value As String)
_ParticipantTag = value
_ParticipantTag= _ParticipantTag.ToUpper
NotifyPropertyChanged("ParticipantTag")
End Set
End Property
Public ReadOnly Property Item(byVal columnName As String) As String Implements IDataErrorInfo.Item
Get
Dim errorString As String = String.Empty
If columnName.Equals("ParticipantTag") Then
If not ParticipantValidationManager.IsValidKeypadTag(_ParticipantTag, True) then
errorString = "Incorrect entry. Please try again."
End If
End If
Return errorString
End Get
End Property
Public ReadOnly Property [Error] As String Implements IDataErrorInfo.Error
Get
Throw New NotImplementedException()
End Get
End Property
End Class
Problem
When I set ItemSource property (as mentioned above in code), Item index is called as many times as there are items in _LaterComersViewModels. Validation works and as a result I get red circle next to TextBox. However, Validation_Error never gets fired until I start typing in Textbox. Typing in TextBox changes the Property binds to it and validate it. Base on validation Validation.Error event is raised, and handled by application. Within that event handler I maintain a count of errors.
So the Question is, why Validation.Error doesn't get raised when one/more items fail on a validation rule during initial data binding? Though it does get raised once property is changed by typing into that TextBox.
Feel free to share any idea, assumption or a solution. Any type of help will be appreciated. Thanks.
Side note: I've a simple C# application which doesn't use data templating. In that application, Validation.Error event gets raised perfectly on start, and on property change. Though in that application, Model is binding to DataContext property of Grid.
Since Validation.Error is an attached event, you could hook up the event handler on the HeaderedItemsControl:
<HeaderedItemsControl x:Name="hicLateComers" ItemTemplate="{StaticResource dtLateComers}" Validation.Error="Validation_Error" />
The result should be pretty much the same since you can easily access both the TextBox and the ParticipantViewModel object in the event handler:
Private Sub Validation_Error(sender As Object, e As ValidationErrorEventArgs)
Dim textBox = CType(e.OriginalSource, TextBox)
Dim participant = CType(textBox.DataContext, ParticipantViewModel)
'...
End Sub

Open user control by button in another user control

So, my set up is like this:
My MainWindow has a TabControl with 5 tabs. To keep the code in my file clean I decided the 5 tabs their content into 5 UserControls.
In let say tab 1 has UserControl Customers (View: CustomersView, ViewModel: CustomersViewModel) with a ComboBox. The ComboBox is ItemSource is bound to a ObservableCollection(Of String) which is filled by DbServiceKlant.GetKlantenlijst.
Also in tab 1 I have a button to add a new Customer to the database. This opens another UserControl which overlays the entire MainWindow.
This 2nd UserControl (View: AddCustomerView, ViewModel: AddCustomerViewModel) has some form to fill in, has a Sub to ass the data to the database.
I first did this all in the MainWindow but the code has taken on sushi proportions (both in .xaml and .xaml.vb) that it isn't maintainable anymore. Having everything in 1 file, it's easy to pass variables and add items to a ObservableCollection.
With everything split up in UserControls, it has been a question to me how I'm going to achieve this. Basically:
UserControl Customers has a ObservableCollection filled with Customer and a button to open UserControl AddCustomer.
In UserControl AddCustomer I have a button which can add the filled in form to the database.
Now the question is:
How do I open UserControl AddCustomer from Customers?
How do I update my ObservableCollection in Customers if I close AddCustomer?
When everything was in 1 file I just manipulated Visibility of AddCustomer and could update the ObservableCollection.
This is a snippet from Customers.
<ComboBox Background="White" ItemsSource="{Binding Klantenlijst}" SelectedItem="{Binding SelectedKlant}" Grid.Column="1" Grid.Row="0" Grid.ColumnSpan="4" />
<Button Grid.Column="5" Command="{Binding OpenAddKlant}" ToolTip="Nieuwe klant">
<Image Source="/Images/Add.png" />
</Button>
The ObservableCollection.
Private _oKlantenlijst As ObservableCollection(Of String) = DbServiceKlant.GetKlantenlijst
Public Property Klantenlijst As ObservableCollection(Of String)
Get
Return _oKlantenlijst
End Get
Set(ByVal value As ObservableCollection(Of String))
_oKlantenlijst = value
OnPropertyChanged()
End Set
End Property
The ICommand:
Private _oOpenAddKlant As New RelayCommand(AddressOf OpenAddKlantSub)
Public ReadOnly Property OpenAddKlant As RelayCommand
Get
Return _oOpenAddKlant
End Get
End Property
And the actual Sub
Public Sub OpenAddKlantSub()
' I think here should be the code to open the AddCustomer UserControl
End Sub
In my 1 file application (which I'm converting to UserControls), the AddCustomer popup had this Sub
Private Sub PopUpAddKlantAdd(sender As Object, e As RoutedEventArgs)
Try
If PupAddKlaNaa.Equals("") OrElse PupAddKlaStr.Equals("") OrElse PupAddKlaGem.Equals("") Then
MessageBox.Show("U moet minstens de naam, straat en gemeente invullen om een nieuwe klant aan te kunnen maken.", "Geen gegevens", MessageBoxButton.OK, MessageBoxImage.Information)
Else
DbServiceKlant.Create(PupAddKlaNaa, PupAddKlaStr, PupAddKlaNr_, PupAddKlaBus, PupAddKlaPos, PupAddKlaGem, PupAddKlaLan, PupAddKlaTel, PupAddKlaBTW)
_oKlant = DbServiceKlant.GetDetails(PupAddKlaNaa)
PopUpAddKlantClose()
PopUpAddKlantClear()
VoGetNaamKlanten()
VoFillDetailsKlant(_oKlant)
VoKlaSel = _oKlant.Naam
End If
Catch ex As Exception
ExceptionLogger.Log(ex, 1)
End Try
End Sub

Adding Items to a DataGrid (MVVM)

Goal
To add a list of a custom class object (DamagedItems) to a DataGrid using the Model, View, ViewModel (MVVM) way of doing things.
I want the user to be able to create entries of damaged parts (deemed improper during inspection of a machine).
What I have done
I have created:
A window: wDamagedItems.xaml in which it's DataContext is set to DamagedItemViewModel
A Model: DamagedItemModel.vb which implements INotifyPropertyChanged
A ViewModel: DamagedItemViewModel.vb where I set properties of classes such as my DamagedItemModel
An ObservableCollection: DamagedItemList.vb which inherits an ObservableCollection(Of DamagedItemModel)
Since my DataContext is set to the DamagedItemViewModel, here is how I setup the properties:
Public Class DamagedItemViewModel
Private _DamagedItem As DamagedItemModel
Private _Add As ICommand
Private _DamagedItems As DamagedItemList
Public Property DamagedItem As DamagedItemModel
Get
Return _DamagedItem
End Get
Set(value As DamagedItemModel)
_DamagedItem = value
End Set
End Property
Public Property DamagedItems As DamagedItemList
Get
Return _DamagedItems
End Get
Set(value As DamagedItemList)
_DamagedItems = value
End Set
End Property
Public Property Add As ICommand
Get
Return _Add
End Get
Set(value As ICommand)
_Add = value
End Set
End Property
Public Sub New()
DamagedItem = New DamagedItemModel("", "", "")
DamagedItems = New DamagedItemList
Add = New DamagedItemAddEntryCommand(Me)
End Sub
Public Function CanUpdate() As Boolean
If DamagedItem.Description = "" Then Return False
If DamagedItem.Initiales = "" Then Return False
Return True
End Function
Public Sub AddEntry()
DamagedItems.Add(DamagedItem) 'Items get added to the datagrid
DamagedItem = New DamagedItemModel 'Does not seem to clear textboxes
End Sub
End Class
Here is how my XAML is set up:
<DataGrid ItemsSource="{Binding Path=DamagedItems}" AutoGenerateColumns="True" HorizontalAlignment="Stretch" Margin="12,90,12,0" Name="DataGrid1" VerticalAlignment="Top" Height="229" / >
<TextBox Text="{Binding DamagedItem.Description, UpdateSourceTrigger=PropertyChanged}" Height="23" HorizontalAlignment="Left" Margin="88,24,0,0" VerticalAlignment="Top" Width="249" />
<TextBox Text="{Binding DamagedItem.Initiales, UpdateSourceTrigger=PropertyChanged}" Height="23" HorizontalAlignment="Left" Margin="88,58,0,0" VerticalAlignment="Top" Width="249" />
As you can see, my textboxes are bound to my Model (which is contained in my ViewModel, which is bound to that Window's DataContext). Whenever I click on my "Add" button, whatever is in the textbox gets added to the DataGrid, but the content in the text boxes stay there.
This step is fine, I write in what I want to add and click on "Add"
After clicking on "Add" i get the following results in the DataGrid, which is fine. The issue is my text boxes are still filled with data yet the Model was cleared (see code after DamagedItemViewModel AddEntry method).
Now when I try to add the following text:
Description: "Part is bent"
Initiales: "A.C"
I get the following result:
The first letter typed in the description gets inputted in the first entry of the DataGrid, then it erases the text in the description textbox. Only then can I keep typing what I want. The same thing occurs for the initiales text box.
Any ideas? If you wish to see more of my code, suggest which portion I should add.
Thank you in advance!
Yup, I remember running into this one. You have to implement iNotifyPropertyCHnaged. This is how the viewmodel class "notifies" the user interface that there has been a change to the underlying property of a binding:
look here:
http://msdn.microsoft.com/en-us/library/ms743695.aspx
You will have to implement this for every property you want reflected back to the view. SO what I do is have a base viewmodel class (ViewModelBase which exposes method RasiePropertyChanged) which implements iNotifyPropertyChanged and then my viewmodles inherit from it. Then I notify the property changed in the property set of the property:
ie:
Public Property Selection As job
Get
Return Me._Selection
End Get
Set(ByVal value As job)
If _Selection Is value Then
Return
End If
_PreviousJob = _Selection
_Selection = value
RaisePropertyChanged(SelectionPropertyName)
End Set
End Property
This seems frustrating at first but is needed to keep the decoupling that MVVM supports. Its easy to implement.

wpf lable text binding not working, where i am going wrong

I am new to WPF and trying something like this to update a label text in the WPF form from the class.
The onchange event is getting triggered, but not getting displayed on the form
Here is my class
Public Class ExtractDetails
Inherits UserControl
Implements INotifyPropertyChanged
Private _prdFrstName as string
Public Event PropertyChanged As PropertyChangedEventHandler Implements INotifyPropertyChanged.PropertyChanged
Public Property PrdFrstName() As String
Get
Return _prdFrstName
End Get
Set(ByVal value As String)
If _prdFrstName <> value Then
_prdFrstName = value
Me.OnPropertyChanged("PrdFrstName")
End If
End Set
End Property
Public Sub suMainStrt()
PrdFrstName = strComurl ''contyains teh URL to nagigate to
webBrwFrst = New WebBrowser
webBrwFrst.Navigate(New Uri(strComurl))
Call extract(webBrwFrst, strComurl)
end sub
end class
the url keeps on changing as i ma getting the values from an excel file and looping for each URL.
i wanted to display the URL currently working now
this is my XAML
<Window x:Class="Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Avenet Prduct Description Extractor" Height="396.627" Width="588.123" Background="AliceBlue" Icon="LGIcon.ico">
<Grid Height="341.077" Width="567.721" Background="AliceBlue">
<StackPanel Margin="170.225,226.418,3.143,0" Name="StackPanel1" Height="97.994" VerticalAlignment="Top">
<Label Height="30.906" Name="lblCrntSt1" Content="{Binding Path=PrdFrstName, UpdateSourceTrigger=PropertyChanged}" Width="161" BorderThickness="2" BorderBrush="AliceBlue" Background="Red" Foreground="White" FontSize="13"></Label>
</StackPanel>
</Grid>
and this is my windows class.
Class Window1
Dim clsIniti As New ExtractDetails
Public Sub New()
' This call is required by the Windows Form Designer.
InitializeComponent()
'clsIniti = New ExtractDetails
Me.DataContext = clsIniti
End Sub
end class
without updating the text labels the entire function is working good. but i wish to display few things. where i am going wrong
I tried data binding by removing few parts to new created project. it works there. so some thing wrong in this code??? :`(
I see two possible causes that this doesn't work for you.
A. How does your OnPropertyChanged method look like?
' Correct implementation:
Private Sub OnPropertyChanged(propertyName As String)
RaiseEvent PropertyChanged(Me, New PropertyChangedEventArgs(propertyName))
End Sub
B. Make sure the ExtractDetails instance you call suMainStrt on, is the same as your DataContext instance. Test this by calling suMainStrt directly from the constructor of Window1:
Class Window1
Dim clsIniti As New ExtractDetails
Public Sub New()
' This call is required by the Windows Form Designer.
InitializeComponent()
'clsIniti = New ExtractDetails
Me.DataContext = clsIniti
' test (if this works, your problem is B.)
clsIniti.suMainStrt()
End Sub
End Class
As a side note: Unless you have good reasons to do this, I suggest you create a dedicated viewmodel (class, not usercontrol) that contains the properties you want to bind to.

Resources