I'm learning wpf with mvvm light and i'm face an issue.
I've a usercontrol with a datagrid that's loaded with a query.
Now i'd like to add an event on the selectedIndex to retrieve the selected line and after that i'll pass the value to an other user control.
the issue is that my event is never fired.
Here is what i did
<DataGrid HorizontalAlignment="Left" Name="dgUser" VerticalAlignment="Top" SelectedIndex="{Binding SelectedIndex, Mode=TwoWay}" SelectedItem="{Binding selectedRow, Mode=TwoWay}" Width="800" Height="253" >
Here is the code of my viewmodel
public RelayCommand selectedRow { get; private set; }
private int _selectedIndex;
public int SelectedIndex
{
get { return _selectedIndex; }
set
{
_selectedIndex = value;
RaisePropertyChanged("SelectedIndex");
}
}
/// <summary>
/// Initializes a new instance of the ListUserViewModel class.
/// </summary>
public ListUserViewModel()
{
selectedRow = new RelayCommand(() => SelectedRowChange());
SelectedIndex = 2;
}
private void SelectedRowChange()
{
System.Windows.MessageBox.Show("test");
}
My row is not selected with SelectedXIndex = 2
and nothing happen when i select an other row
You are trying to bind a Command on your ViewModel to the SelectedItem of your DataGrid and that's not quite how it works.
You want to hook into the DataGrid.SelectionChanged event and presumably fire your ViewModel's RelayCommand at that point.
Check this answer for a great explanation on how to do this in XAML.
EDIT:
To pass the SelectedItem to your RelayCommand as a command parameter, use the following in your XAML:
<i:Interaction.Triggers>
<i:EventTrigger EventName="SelectionChanged">
<i:InvokeCommandAction Command="{Binding MyCommand}"
CommandParameter="{Binding Path=SelectedItem, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=DataGrid}}" />
</i:EventTrigger>
</i:Interaction.Triggers>
and ensure that you change your RelayCommand to be of the type you wish.
NOTE: You have not provided what the type of the items you have in your DataGrid, so I'll use object here.
public RelayCommand<object> selectedRow { get; private set; }
You can then rely on the command's parameter being the selected item:
public ListUserViewModel()
{
selectedRow = new RelayCommand(i => SelectedRowChange(i));
SelectedIndex = 2;
}
private void SelectedRowChange(object selectedItem)
{
// selectedItem is the item that has just been selected
// do what you wish with it here
System.Windows.MessageBox.Show("test");
}
Related
Suppose I have the following:
<Grid x:Name="root">
<ListBox ItemsSource="{Binding Path=Items}">
<ListBox.ItemTemplate>
<DataTemplate>
<DockPanel>
<Button Command="{Binding ElementName=root, Path=DataContext.MyCommand}" />
<!---There are other UI elements here -->
</DockPanel/>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
This code executes MyCommand when the button is clicked, but I also want to execute MyCommand when the user presses Enter Key while the row is selected (which means button is not in focus)...
How to best do this in WPF/MEF/PRISM?
I recognize that in code I can't cast the DataContext to (MyViewModel) because that would violate MEF, and in code behind I only know the viewmodel interface type IViewModel...
//code behind of the XAML file above
public IViewModel ViewModel
{
get;
set;
}
Note: I am thinking of doing this in code behind, but I'm not sure if the answer is even I should do it in the viewmodel...
This can be done using KeyBindings. Create a new KeyBidnign to your Window and associate a Command to it. More information on KeyBindings.
<ListBox.InputBindings>
<KeyBinding Key="Enter" Command="{Binding MyCommand}"/>
</ListBox.InputBindings>
The CanExecute method of your viewmodel should have a validation for Selected Row.
public class ViewModel
{
public ViewModel()
{
MyCommand = new DelegateCommand(MyCommandExecute, MyCommandCanExecute);
}
private void MyCommandExecute()
{
// Do your logic
}
private bool MyCommandCanExecute()
{
return this.SelectedRow != null;
}
public object SelectedRow { get; set; }
public DelegateCommand MyCommand { get; set; }
}
I am having a hard time finding the right syntax for binding to a ComboBox's SelectedItem's property. This is the XAML I am trying to use for the binding. Where you see SelectedItem.Mode is the idea I am having difficulty with. Note that CurrentMode is in the ViewModel and has the same type as SelectedItem.Mode
<ComboBox SelectedItem.Mode="{Binding Path=CurrentMode, Mode=TwoWays}">
<ComboBox.ItemTemplate>
<DataTemplate>
<Image Source="{Binding ImageSource}"/>
</DataTemplate>
</ComboBox.ItemTemplate>
<local:ModeItem Mode="Free" ImageSource="pencil.png"/>
<local:ModeItem Mode="Arrow" ImageSource="arrow.png"/>
</ComboBox>
A local:ModeItem looks like this
public class ModeItem : DependencyObject, INotifyPropertyChanged
{
public static readonly DependencyProperty ModeProperty = DependencyProperty.Register("Mode", typeof(AnnotationMode), typeof(ModeItem));
public AnnotationMode Mode
{
get { return (AnnotationMode)GetValue(ModeProperty); }
set { SetValue(ModeProperty, value); }
}
public string ImageSource { get; set; }
public event PropertyChangedEventHandler PropertyChanged;
}
I am using MVVM and trying to bind the AnnotationMode (CurrentMode) of the ViewModel to that of the ComboBox's SelectedItem's AnnotationMode (Mode)
Just do this
SelectedItem="{Binding CurrentMode}
You don't have to do all this extra stuff you are doing. Note You do need to make the datacontext of the combobox is pointing to your viewmodel.
Edit :-
You should be able to do this
SelectedValue="{Binding CurrentMode, Mode=TwoWay}"
SelectedValuePath="Mode"
I'm using the MVVM Light Toolkit with Silverlight.
On my UserControl I have a ListBox that displays a list of files. Each file has a delete image next to the file name. In the DataTemplate for the listbox I have an image (or can use a button) and a TextBlock.
So I want to capture using the event when the user will clicks on the image(or button with image) to remove the file from the list of files.
But I cannot seem to capture the event. Maybe this is due to having the SelectedItem Event on the listbox?
public class MainViewModel : ViewModelBase
{
#region Properties
public const string SelectedListBoxFilePropertyName = "SelectedUploadFile";
private UploadFile _selectedUploadFile = null;
public UploadFile SelectedUploadFile
{
get
{
return _selectedUploadFile;
}
set
{
if (_selectedUploadFile == value)
return;
_selectedUploadFile = value;
RaisePropertyChanged(SelectedListBoxFilePropertyName);
}
}
public const string UploadFilesPropertyName = "UploadFiles";
private ObservableCollection<UploadFile> _uploadFiles = new ObservableCollection<UploadFile>();
public ObservableCollection<UploadFile> UploadFiles
{
get
{
return _uploadFiles;
}
set
{
if (_uploadFiles == value)
return;
_uploadFiles = value;
RaisePropertyChanged(UploadFilesPropertyName);
}
}
#endregion
public static ICommand BrowseCommand { get; private set; }
public static ICommand DragDropFileCommand { get; private set; }
public static ICommand RemoveCommand { get; private set; }
#region Constructor
public MainViewModel()
{
if (IsInDesignMode)
{
// Code runs in Blend --> create design time data.
UploadFiles = new UploadFileContainer().UploadFiles;
}
else
{
// Code runs "for real"
}
WireUpCommands();
}
#endregion
#region Event Handlers
private void OnBrowseFileCommand()
{
var dialog = new OpenFileDialog();
dialog.ShowDialog();
if (dialog.Files != null)
AddFiles(dialog.Files);
}
private void OnDropFileCommand(DragEventArgs e)
{
var files = e.Data.GetData(DataFormats.FileDrop) as FileInfo[];
AddFiles(files);
}
private void OnRemoveFileCommand()
{
UploadFiles.Remove(_selectedUploadFile);
}
#endregion
#region Private Methods
private void WireUpCommands()
{
BrowseCommand = new RelayCommand(OnBrowseFileCommand);
DragDropFileCommand = new RelayCommand<DragEventArgs>(e => OnDropFileCommand(e));
RemoveCommand = new RelayCommand(OnRemoveFileCommand);
UploadCommand = new RelayCommand(OnClickUploadCommand);
}
#endregion
}
<ListBox Grid.Row="1" Height="214" HorizontalAlignment="Left" AllowDrop="True" Margin="6,26,0,0" Name="UploadFilesListBox" VerticalAlignment="Top" Width="415" ItemsSource="{Binding Path=UploadFiles}" SelectedItem="{Binding Path=SelectedListBoxFile, Mode=TwoWay}" ScrollViewer.VerticalScrollBarVisibility="Auto">
<i:Interaction.Triggers>
<i:EventTrigger EventName="Drop">
<cmd:EventToCommand Command="{Binding DragDropFileCommand}" PassEventArgsToCommand="True"/>
</i:EventTrigger>
</i:Interaction.Triggers>
<ListBox.Background>
<ImageBrush ImageSource="/FileUploadApplication;component/Resources/dragdrophere.png" Stretch="None" />
</ListBox.Background>
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<Button Command="{Binding RemoveCommand}">
<Image Source="/FileUploadApplication;component/Resources/delete.png"/>
</Button>
<Image Source="/FileUploadApplication;component/Resources/delete.png">
<i:Interaction.Triggers>
<i:EventTrigger EventName="Click">
<cmd:EventToCommand Command="{Binding RemoveCommand}"/>
</i:EventTrigger>
</i:Interaction.Triggers>
</Image> <TextBlock Text=" " />
<TextBlock Text="{Binding Name}" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Since your ItemsSource is UploadFiles it's probably sending the event to UploadFile and not the view model the user control is bound to.
Your button is the element of the ItemTemplate. you're binding the listbox ItemsSource to the ObservableCollection. Every Itemtemplate DataContext is no MainViewModel, but UploadFile, which has no RemoveCommand.
I was solving this by adding to every item the parent object using constructor. RemoveCommand was inside the item's ViewModel and insede the remove function i was calling the parent's method to delete the item.
Not sure if that's the best solution but it worked for me.
If you have a Silverlight Toolkit NumericUpDown control binded to a MVVM property and a RelayCommand trigger set (any event), the command is called before NumericUpDown changes MVVM property value. This means, you can not use the new (changed) value with you method/action/command...
XAML:
<inputToolkit:NumericUpDown x:Name="testNum" Value="{Binding RegisterForm, Mode=TwoWay}">
<i:Interaction.Triggers>
<i:EventTrigger EventName="ValueChanged">
<GalaSoft_MvvmLight_Command:EventToCommand Command="{Binding DoSomethingCommand}"/>
</i:EventTrigger>
</i:Interaction.Triggers>
</inputToolkit:NumericUpDown>
MVVM (C#):
DoSomethingCommand = new RelayCommand(() =>
{
OtherRegisterForm = RegisterForm;
});
In this case, if you have v value 0 and you input a new value 123 in NumericUpDown control it triggers the "DoSomethingCommand" before "RaisePropertyChange" event on MVVM property.
"OtherRegisterForm" would be 0 and not 123.
Is there a way to make this work?
oh boy, wasn't easy but here u are :
xaml part :
<toolkit:NumericUpDown Value="{Binding SomeNumber}">
<i:Interaction.Triggers>
<i:EventTrigger EventName="ValueChanged">
<GalaSoft_MvvmLight_Command:EventToCommand Command="{Binding MyCommand}" PassEventArgsToCommand="True" />
</i:EventTrigger>
</i:Interaction.Triggers>
</toolkit:NumericUpDown>
and cs code :
public class MainViewModel : ViewModelBase
{
public double SomeNumber { get; set; }
public MainViewModel()
{
SomeNumber = 10;
MyCommand = new RelayCommand<RoutedPropertyChangedEventArgs<double>>(myActionMethod);
}
public RelayCommand<RoutedPropertyChangedEventArgs<double>> MyCommand { get; set; }
public void myActionMethod(RoutedPropertyChangedEventArgs<double> arg)
{
MessageBox.Show(arg.NewValue.ToString());
}
}
hope that helps, Arek
here is my code:
xaml side:
I use a data template to bind with item "dataType1"
<DataTemplate DataType="{x:Type dataType1}">
<WrapPanel>
<CheckBox IsChecked="{Binding Path=IsChecked, Mode=TwoWay}" Command="{Binding Path=CheckedCommand} />
<TextBlock Text="{Binding Path=ItemName, Mode=OneWay}" />
</WrapPanel>
</DataTemplate>
then I create a ComboBox with item with type "dataType1"
<ComboBox Name="comboBoxItems" ItemsSource="{Binding Path=DataItems, Mode=TwoWay}">
and here is dataType1 difinition:
class dataType1{public string ItemName{get; set;} public bool IsChecked {get; set;}}
the scenario is I prepare a list of dataType1 and bind it to the ComboBox, ItemName display flawlessly while CheckBox IsChecked value is always unchecked regardless the value of "IsChecked" in dataType1.
Is special handling needed in binding IsChecked property in CheckBox in wpf?
Peter Leung
The problem you're having here is that the CheckBox doesn't know when the value of dataType1.IsChecked changes. To fix that, change your dataType1 to:
class dataType1 : INotifyPropertyChanged
{
public string ItemName { get; set; }
private bool isChecked;
public bool IsChecked
{
get { return isChecked; }
set
{
if (isChecked != value)
{
isChecked = value;
if (PropertyChanged != null)
{
PropertyChanged(this, new PropertyChangedEventArgs("IsChecked"));
}
}
}
}
public event PropertyChangedEventHandler PropertyChanged;
}
So now, when the property value is changed it will notify the binding that it needs to update by raising the PropertyChanged event.
Also, there are easier ways to do this that avoid you having to write as much boiler-plate code. I use BindableObject from Josh Smith.