We Keep Coding

Navigation button dependent on conditions from other ViewModel

This website has greatly benefited me, but now I have to ask a question of my own.
I am new to C# and MVVM applications..
Now I am building an app with different views, one view is the navigation view which should show other views depending on the navigation buttons. These buttons depend on the entered value in a view.
Example:
There is a navigationView containing a ContentControl and two buttons (nextStep and previousStep). I have put several textboxes in a view (parameterView) and associated model (parameterViewModel) which is displayed in the ContentControl. When all parameters are entered, the user may, by means of a button (nextStep mentioned before), go to the next step/view (checkDataView).
Now the button (in navigationView) must therefore be visible when all parameters are filled in parameterView, and hidden when one parameter is not filled in. The nextStep button should activate another page in the ContentControl.
I can navigate with checkboxes or radio buttons, but only without dependence on values ​​in another viewModel.
What should I do to get the dependency of parameters in another viewModel?
My NavigationView ContentControl and buttons are defined as:
<ContentControl Grid.Row="1"
Grid.ColumnSpan="5"
Content="{Binding CurrentItemView}" />
<Button Grid.Column="0"
Grid.Row="2"
Content="Next Step"
Style="{StaticResource SubMenuButton}"
Visibility="{Binding PreviousStepCommandVisibility}"
Command="{Binding PreviousStepCommand}"/>
<Button Grid.Column="3"
Grid.Row="2"
Content="Previous Step"
Style="{StaticResource SubMenuButton}"
Visibility="{Binding NextStepCommandVisibility}"
Command="{Binding NextStepCommand}"/>
My ViewModel of above View:
namespace SomeApp.MVVM.ViewModel
{
class GenerateMenuViewModel : BaseViewModel
{
public RelayCommand PreviousStepCommand { get; set; }
public RelayCommand NextStepCommand { get; set; }
private Visibility _previousStepCommandVisibility;
public Visibility PreviousStepCommandVisibility
{
get { return _previousStepCommandVisibility; }
set { _previousStepCommandVisibility = value; }
}
private Visibility _nextStepCommandVisibility;
public Visibility NextStepCommandVisibility
{
get { return _nextStepCommandVisibility; }
set { _nextStepCommandVisibility = value; }
}
public SomethingViewModel SomethingVM { get; set; }
private object _currentItemView;
public object CurrentItemView
{
get { return _currentItemView; }
set
{
_currentItemView = value;
OnPropertyChanged();
}
}
public GenerateMenuViewModel()
{
SomethingVM = new SomethingViewModel();
CurrentItemView = SomethingVM;
}
}
}
TextBoxes in View2, which values give dependence to the navigation buttons, are defined as:
<TextBox Text="{Binding Paramater1, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"/>
<TextBox Text="{Binding Paramater2, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"/>
<TextBox Text="{Binding Paramater3, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"/>
The ViewModel which belongs to the above View:
namespace SomeApp.MVVM.ViewModel
{
class View1ViewModel : BaseViewModel
{
public View1ViewModel()
{
}
private string _parameter1;
public string Parameter1
{
get { return _parameter1; }
set { _parameter1 = value; OnPropertyChanged(); }
}
private string _parameter2;
public string Parameter2
{
get { return _parameter2; }
set { _parameter2 = value; OnPropertyChanged(); }
}
private string _parameter3;
public string Parameter3
{
get { return _parameter3; }
set { _parameter3 = value; OnPropertyChanged(); }
}
}
}

The simple way is to add a property in viewModel to indicate that all the parameters are validated and succeeded.
class View1
{
public bool Isvalid { get => !validationResults.Values.Contains(false); }
Dictionary<string, bool> validationResults = new Dictionary<string, bool>
{
{ nameof(Val1), false }
};
string val1 = "";
public string Val1
{
get => val1; set
{
val1 = value;
OnPropertyChanged();
validationResults[nameof(Val1)] = !string.IsNullOrEmpty(value); //Validation goes here
}
}

How to get property and call command from different ViewModel with mvvm pattern

I have a ViewModel with all the properties that i will need in every sub ViewModel.
It's the first time i try to split commands and viewmodel to multiple files. Last time everything was in the same ViewModel and it was a pain to work with it. Everything shows up as expected but i want to find a way to pass the same data in every viewmodel.
From my GetOrdersCommand, i want to get the HeaderViewModel.SelectedSource property. I didn't find any way to do it without getting a null return or loosing the property data...
I would like to call my GetOrdersCommand from HeaderView button too.
Any tips how i can achieve this ? Perhaps, my design is not good for what i'm trying to do ?
MainWindow.xaml
<views:HeaderView Grid.Row="0" Grid.Column="1" Grid.ColumnSpan="2" DataContext="{Binding HeaderViewModel}" LoadHeaderViewCommand="{Binding LoadHeaderViewCommand}"/>
<TabControl TabStripPlacement="Bottom" Grid.Row="1" Grid.Column="1" Grid.RowSpan="2" Grid.ColumnSpan="2">
<TabItem Header="General">
</TabItem>
<TabItem Header="Orders">
<views:OrderView DataContext="{Binding OrderViewModel}" GetOrdersCommand="{Binding GetOrdersCommand}"/>
</TabItem>
</TabControl>
HeaderView.xaml
<DockPanel>
<ComboBox DockPanel.Dock="Left" Width="120" Margin="4" VerticalContentAlignment="Center" ItemsSource="{Binding SourceList}" SelectedItem="{Binding SelectedSource}" DisplayMemberPath="SourceName"/>
<Button x:Name="btnTest" HorizontalAlignment="Left" DockPanel.Dock="Left" Margin="4" Content="Test"/>
</DockPanel>
HeaderView.xaml.cs
public partial class OrderView : UserControl
{
public ICommand GetOrdersCommand
{
get { return (ICommand)GetValue(GetOrdersCommandProperty); }
set { SetValue(GetOrdersCommandProperty, value); }
}
public static readonly DependencyProperty GetOrdersCommandProperty =
DependencyProperty.Register("GetOrdersCommand", typeof(ICommand), typeof(OrderView), new PropertyMetadata(null));
public OrderView()
{
InitializeComponent();
}
private void UserControl_Loaded(object sender, RoutedEventArgs e)
{
if (GetOrdersCommand != null)
{
GetOrdersCommand.Execute(this);
}
}
}
MainViewModel.cs
private OrderViewModel orderViewModel;
public OrderViewModel OrderViewModel { get; set; } // Getter, setter with OnPropertyChanged
private HeaderViewModel headerViewModel;
public HeaderViewModel HeaderViewModel { get; set; } // Getter, setter with OnPropertyChanged
public MainViewModel()
{
HeaderViewModel = new HeaderViewModel();
OrderViewModel = new OrderViewModel();
}
HeaderViewModel.cs
public ICommand LoadHeaderViewCommand { get; set; }
public HeaderViewModel()
{
LoadHeaderViewCommand = new LoadHeaderViewCommand(this);
}
GetOrdersCommand.cs
public class GetOrdersCommand : ICommand
{
public event EventHandler CanExecuteChanged;
private readonly OrderViewModel _orderViewModel;
public GetOrdersCommand(OrderViewModel orderViewModel)
{
_orderViewModel = orderViewModel;
}
public bool CanExecute(object parameter)
{
return true;
}
public void Execute(object parameter)
{
/* Build Order List according to HeaderViewModel.SelectedSource */
_orderViewModel.Orders = new ObservableCollection<Order>()
{
new Order { ID = 1, IsReleased = false, Name = "Test1"},
new Order { ID = 2, IsReleased = true, Name = "Test2"},
};
}
}

Thanks guys ! I moved my commands to their owning ViewModel as suggested.
I tried MVVVM Light Tools and found about Messenger Class.
I used it to send my SelectedSource (Combobox from HeaderView) from HeaderViewModel to OrderViewModel. Am i suppose to use Messenger class like that ? I don't know, but it did the trick!!!
I thought about moving GetOrdersCommand to OrderViewModel, binding my button command to OrderViewModel, binding SelectedSource as CommandParameter but i didn't know how i was suppose to RaiseCanExecuteChanged when HeaderViewModel.SelectedSource changed... Any advice?
MainWindow.xaml
<views:HeaderView DataContext="{Binding Source={StaticResource Locator}, Path=HeaderVM}" Grid.Row="0" Grid.Column="1" Grid.ColumnSpan="2"/>
<TabControl TabStripPlacement="Bottom" Grid.Row="1" Grid.Column="1" Grid.RowSpan="2" Grid.ColumnSpan="2">
<TabItem Header="General">
</TabItem>
<TabItem Header="Orders">
<views:OrderView DataContext="{Binding Source={StaticResource Locator}, Path=OrderVM}"/>
</TabItem>
</TabControl>
OrderViewModel.cs
private ObservableCollection<Order> _orders;
public ObservableCollection<Order> Orders
{
get { return _orders; }
set
{
if (_orders != value)
{
_orders = value;
RaisePropertyChanged(nameof(Orders));
}
}
}
public OrderViewModel()
{
Messenger.Default.Register<Source>(this, source => GetOrders(source));
}
private void GetOrders(Source source)
{
if (source.SourceName == "Production")
{
Orders = new ObservableCollection<Order>(){
new Order { ID = 1, IsReleased = false, Name = "Production 1" }
};
}
else
{
Orders = new ObservableCollection<Order>(){
new Order { ID = 2, IsReleased = true, Name = "Test 1" }
};
}
}
Part of HeaderViewModel.cs
private Source _SelectedSource;
public Source SelectedSource
{
get { return _SelectedSource; }
set
{
if (_SelectedSource != value)
{
_SelectedSource = value;
RaisePropertyChanged(nameof(SelectedSource));
GetOrdersCommand.RaiseCanExecuteChanged();
}
}
}
private RelayCommand _GetOrdersCommand;
public RelayCommand GetOrdersCommand
{
get
{
if (_GetOrdersCommand == null)
{
_GetOrdersCommand = new RelayCommand(GetOrders_Execute, GetOrders_CanExecute);
}
return _GetOrdersCommand;
}
}
private void GetOrders_Execute()
{
Messenger.Default.Send(SelectedSource);
}
private bool GetOrders_CanExecute()
{
return SelectedSource != null ? true : false;
}

Proper MVVM implementation of dynamically generated usercontrol

My scenario: I have a usercontrol consisting of a comboBox, and a TextBox. The comboBox should hold numbers contained in an ObservableCollection.
The task: The numbers in the ObservableCollection represent paths to book-chapters; therefore each chapter is unique. Meaning: if I have chapters 1 - 5, then the first userControl combo should show all chapters 1-5 (whereas one of them is selected randomly), the second userControl combo contains all chapters, but not the one selected in the previous combo, and so on. The textBox is for annotations for the chapters.
What I achieved so far: I have currently no model; just a main viewModel (ItemsViewModel in my case), and a viewModel for my userControl (PathViewModel). Then there is the mainWindow view.
The problem: On my mainWindow I can create several dynamically created userControls. The userControl TextBox is currently bound to a text property, while the index of the comboBox is bound to another property. But I don't know:
- how to gain access to the index, selected item/value of the specifically userControls
- how to react to a comboBox item/index change
Here is my code:
The userControl
<UserControl> <StackPanel Orientation="Horizontal">
<ComboBox x:Name="combo" Margin="10" MinWidth="60" VerticalAlignment="Center" ItemsSource="{Binding AvailableNumbers}" SelectedIndex="{Binding TheIndex}" />
<TextBox Margin="10" MinWidth="120" Text="{Binding TheText, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"/>
</StackPanel>
The MainWindow
<Window>...<Window.DataContext>
<local:ItemsViewModel/>
</Window.DataContext>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<StackPanel x:Name="HostPanel">
<ItemsControl ItemsSource="{Binding PathViewModels}">
<ItemsControl.ItemTemplate>
<DataTemplate>
<local:PathControl/>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</StackPanel>
<StackPanel Grid.Column="1">
<Button Command="{Binding UCCreationCommand}" Content="Add User Control" Margin="10"/>
<Button Command="{Binding UCDeletionCommand}" CommandParameter="" Content="Delete User Control" Margin="10"/>
<Button Command="{Binding ReadoutCommand}" Content="Show ITEMS" Margin="10"/>
</StackPanel>
</Grid></Window>
My main ViewModel (called ItemsViewModel)
public class ItemsViewModel : NotifyPropertyChangedBase
{private int _aNumber;
public int ANumber
{
get { return _aNumber; }
set { _aNumber = value;
OnPropertyChanged(ref _aNumber, value);
}
}
public ObservableCollection<PathViewModel> PathViewModels { get; set; } = new
ObservableCollection<PathViewModel>();
public ObservableCollection<int> AllNumbers { get; set; } = new ObservableCollection<int>();
public ItemsViewModel()
{
UCCreationCommand = new CommandDelegateBase(UCCreationExecute, UCCreationCanExecute);
UCDeletionCommand = new CommandDelegateBase(UCDeletionExecute, UCDeletionCanExecute);
ReadoutCommand = new CommandDelegateBase(ReadoutExecute, ReadoutCanExecute);
AllNumbers.Add(1);
AllNumbers.Add(2);
AllNumbers.Add(3);
AllNumbers.Add(4);
AllNumbers.Add(5);
}
private bool ReadoutCanExecute(object paramerter)
{
if (PathViewModels.Count > 0)
{
return true;
}
return false;
}
private void ReadoutExecute(object parameter)
{
//just for testing
}
public ICommand UCCreationCommand { get; set; }
public ICommand UCDeletionCommand { get; set; }
public ICommand ReadoutCommand { get; set; }
private bool UCCreationCanExecute(object paramerter)
{
if (PathViewModels.Count < 8)
{
return true;
}
else
{
return false;
}
}
private void UCCreationExecute(object parameter)
{
PathViewModel p = new PathViewModel();
foreach (int i in AllNumbers)
{
p.AvailableNumbers.Add(i);
}
int rndIndex = 0;
Random rnd = new Random();
//creates a random chapter index
rndIndex = rnd.Next(0, p.AvailableNumbers.Count);
//just explicit for debugging reasons
p.TheIndex = rndIndex;
AllNumbers.RemoveAt(rndIndex);
PathViewModels.Add(p);
}
private bool UCDeletionCanExecute(object paramerter)
{
if (PathViewModels.Count != 0)
{
return true;
}
else
{
return false;
}
}
private void UCDeletionExecute(object parameter)
{
PathViewModel p = new PathViewModel();
int delIndex = PathViewModels.Count - 1;
p = PathViewModels[delIndex];
AllNumbers.Add((int)p.TheValue+1);
PathViewModels.Remove(p);
}
}
And finally my UserControl ViewModel:
public class PathViewModel : NotifyPropertyChangedBase
{
public ObservableCollection<int> AvailableNumbers { get; set; } = new ObservableCollection<int>();
private int _theIndex;
public int TheIndex
{
get { return _theIndex; }
set
{
_theIndex = value;
OnPropertyChanged(ref _theIndex, value);
}
}
private int _theValue;
public int TheValue
{
get { return _theValue; }
set
{
_theValue = value;
OnPropertyChanged(ref _theValue, value);
}
}
private string _theText;
public string TheText
{
get { return _theText; }
set
{
_theText = value;
OnPropertyChanged(ref _theText, value);
}
}
public PathViewModel()
{
}
}
Any hints on how to go on from here would be highly appreaciated.

initialize a WPF with undefined datatype

Here is a class with undefined variable that needs to be passed into the WPF window.
public class SelectedVal<T>
{
public T val {get;set;}
}
Window:
public partial class SOMEDialogue : Window
{
public List<SelectedVal<T>> returnlist { get { return FullList; } }
public List<SelectedVal<T>> FullList = new List<SelectedVal<T>>();
public SOMEDialogue (List<SelectedVal<T>> inputVal)
{
InitializeComponent();
}
}
So here is the question, how can I do this properly to get the T and have a global variable set in my WPF?
Edited (code edited too):
The purpose for the WPF is:
A list of SelectedVal<T> input
Display this input in this WPF
Depend on the T type, user can do something about this input
When finished a return List<SelectedVal<T>> returnlist can be
accessed

This is the basic idea I'm describing. Let me know if you hit any snags. I'm guessing that the search text and the min/max int values are properties of the dialog as a whole. I'm also assuming that there may be a mixture of item types in the collection, which may be an assumption too far. Can you clarify that?
Selected value classes
public interface ISelectedVal
{
Object Val { get; set; }
}
public class SelectedVal<T> : ISelectedVal
{
public T Val { get; set; }
object ISelectedVal.Val
{
get => this.Val;
set => this.Val = (T)value;
}
}
public class StringVal : SelectedVal<String>
{
}
public class IntVal : SelectedVal<int>
{
}
Dialog Viewmodel
public class SomeDialogViewModel : ViewModelBase
{
public SomeDialogViewModel(List<ISelectedVal> values)
{
FullList = values;
}
public List<ISelectedVal> FullList { get; set; }
private String _searchText = default(String);
public String SearchText
{
get { return _searchText; }
set
{
if (value != _searchText)
{
_searchText = value;
OnPropertyChanged();
}
}
}
private int _minInt = default(int);
public int MinInt
{
get { return _minInt; }
set
{
if (value != _minInt)
{
_minInt = value;
OnPropertyChanged();
}
}
}
private int _maxInt = default(int);
public int MaxInt
{
get { return _maxInt; }
set
{
if (value != _maxInt)
{
_maxInt = value;
OnPropertyChanged();
}
}
}
}
.xaml.cs
public SOMEDialogue (List<ISelectedVal> inputValues)
{
InitializeComponent();
DataContext = new SomeDialogViewModel(inputValues);
}
XAML
<Window.Resources>
<DataTemplate DataType="{x:Type local:StringVal}">
<StackPanel>
<Label>Value</Label>
<Label Content="{Binding Val}" />
<Label>Search text:</Label>
<TextBox Text="{Binding DataContext.SearchText, RelativeSource={RelativeSource AncestorType=Window}}" />
<!-- Other stuff -->
</StackPanel>
</DataTemplate>
<DataTemplate DataType="{x:Type local:IntVal}">
<StackPanel>
<Label>Value</Label>
<Label Content="{Binding Val}" />
<Label>Min value:</Label>
<TextBox Text="{Binding DataContext.MinIntVal, RelativeSource={RelativeSource AncestorType=Window}}" />
<Label>Max value:</Label>
<TextBox Text="{Binding DataContext.MaxIntVal, RelativeSource={RelativeSource AncestorType=Window}}" />
<!-- Other stuff -->
</StackPanel>
</DataTemplate>
</Window.Resources>
<Grid>
<ItemsControl
ItemsSource="{Binding FullList}"
/>
</Grid>

I have bind numbers to CombBox. I want change value comboBox and textBox changed value

I want change number from ComboBox and change value in TextBox.
(For example I have number =2 and content at "lblblblb" ofc. this is in ObservableCollection<string>, so I to call ContentWithListView[SelectNumberStep])
ReadPage.xaml
<TextBox HorizontalAlignment="Left" Margin="580,154,0,0"
TextWrapping="Wrap" Text="{Binding ContentWithListView[SelectNumberStep],Mode=TwoWay}"
VerticalAlignment="Top" Width="725" Height="82"/>
<ComboBox HorizontalAlignment="Left" Margin="440,154,0,0"
ItemsSource="{Binding NumberStep,Mode=TwoWay}"
SelectedItem="{Binding SelectNumberStep,Mode=TwoWay}"
VerticalAlignment="Top" Width="95" Height="77" />
How I change content in TextBox from CombBox numbers?
ReadViewModel.cs
private ObservableCollection<string> contentWithListView;
public ObservableCollection<string> ContentWithListView
{
get
{
return this.contentWithListView;
}
set
{
this.contentWithListView = value;
}
}
private ObservableCollection<int> stepNumber;
public ObservableCollection<int> NumberStep
{
get
{
return this.stepNumber;
}
set
{
this.stepNumber = value;
}
}
private int selectNumberStep;
public int SelectNumberStep
{
get
{
return this.selectNumberStep;
}
set
{
this.selectNumberStep = value;
}
}

previous answer doesn't integrate the fact he textbox content have to be in TwoWays so, in such scenario, you could consolidate your properties with the INotifyPropertyChanged interface like that:
Xaml part
<StackPanel d:DataContext="{d:DesignInstance Type=classes:StackOverFlowX }">
<TextBox Text="{Binding Content, Mode=TwoWay}"/>
<ComboBox ItemsSource="{Binding NumberStep, Mode=TwoWay}"
SelectedItem="{Binding SelectNumberStep,Mode=TwoWay}"/>
</StackPanel>
Class
using System.ComponentModel;
using System.Runtime.CompilerServices;
public class StackOverFlowX : INotifyPropertyChanged
{
public event PropertyChangedEventHandler PropertyChanged;
public StackOverFlowX()
{
}
private ObservableCollection<string> contentWithListView;
public ObservableCollection<string> ContentWithListView
{
get
{
return this.contentWithListView;
}
set
{
this.contentWithListView = value;
OnPropertyChanged();
}
}
private ObservableCollection<int> stepNumber;
public ObservableCollection<int> NumberStep
{
get
{
return this.stepNumber;
}
set
{
this.stepNumber = value;
OnPropertyChanged();
}
}
private int selectNumberStep;
public int SelectNumberStep
{
get
{
return this.selectNumberStep;
}
set
{
this.selectNumberStep = value;
OnPropertyChanged();
OnPropertyChanged("Content");
}
}
private string _content;
public string Content
{
get
{
return contentWithListView[this.SelectNumberStep];
}
set
{
this._content = value;
if (contentWithListView.IndexOf(value) > -1)
{
SelectNumberStep = contentWithListView.IndexOf(value);
OnPropertyChanged("SelectNumberStep");
}
OnPropertyChanged();
}
}
protected void OnPropertyChanged([CallerMemberName] string propertyName = null)
{
var eventHandler = this.PropertyChanged;
if (eventHandler != null)
{
eventHandler(this, new PropertyChangedEventArgs(propertyName));
}
}
}

I would change your view model code around, so that the text box binds to a scalar string value which is updated on the SelectNumberStep change:
public string Content
{
get
{
// bounds checking here..
return contentWithListView[this.SelectNumberStep];
}
}
public int SelectNumberStep
{
get
{
return this.selectNumberStep;
}
set
{
this.selectNumberStep = value;
this.NotifyOfPropertyChange(() => this.SelectNumberStep);
this.NotifyOfPropertyChange(() => this.Content);
}
}
<TextBox Text="{Binding Content}" ... />