How can I tie two combo boxes together in wpf - c#

I have 2 combo boxes, one that contains a list of 'Items' and another that contains a list of 'Subitems'.
The list of Subitems depends on the currently selected Item.
I've got most of this working (by binding the ItemSource of the Subitems to a PossibleSubitems property), however the problem is when I change the Item and the Subitem is no longer valid for the new item. In this case I just want to pick the first valid subitem, but instead I get a blank combo-box. Note that I think that the property in the class is set correctly, but the binding doesn't seem to reflect it correctly.
Here's some code to show you what I'm doing. In this case, I have:
'Item 1' which can have SubItem A or Subitem B and
'Item 2' which can have SubItem B or Subitem C
The problem comes when I switch to Item 2 when I have Subitem A selected.
XAML
<Window x:Class="WpfApplication1.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="134" Width="136">
<StackPanel Height="Auto" Width="Auto">
<ComboBox ItemsSource="{Binding PossibleItems, Mode=OneWay}" Text="{Binding CurrentItem}"/>
<ComboBox ItemsSource="{Binding PossibleSubitems, Mode=OneWay}" Text="{Binding CurrentSubitem}"/>
</StackPanel>
</Window>
Code Behind:
using System;
using System.Collections.ObjectModel;
using System.ComponentModel;
using System.Windows;
namespace WpfApplication1
{
public partial class MainWindow : Window, INotifyPropertyChanged
{
// List of potential Items, used to populate the options for the Items combo box
public ObservableCollection<string> PossibleItems
{
get
{
ObservableCollection<string> retVal = new ObservableCollection<string>();
retVal.Add("Item 1");
retVal.Add("Item 2");
return retVal;
}
}
// List of potential Items, used to populate the options for the Subitems combo box
public ObservableCollection<string> PossibleSubitems
{
get
{
ObservableCollection<string> retVal = new ObservableCollection<string>();
if (CurrentItem == PossibleItems[0])
{
retVal.Add("Subitem A");
retVal.Add("Subitem B");
}
else
{
retVal.Add("Subitem B");
retVal.Add("Subitem C");
}
return retVal;
}
}
// Track the selected Item
private string _currentItem;
public string CurrentItem
{
get { return _currentItem; }
set
{
_currentItem = value;
// Changing the item changes the possible sub items
NotifyPropertyChanged("PossibleSubitems");
}
}
// Track the selected Subitem
private string _currentSubitem;
public string CurrentSubitem
{
get { return _currentSubitem; }
set
{
if (PossibleSubitems.Contains(value))
{
_currentSubitem = value;
}
else
{
_currentSubitem = PossibleSubitems[0];
// We're not using the valuie specified, so notify that we have in fact changed
NotifyPropertyChanged("CurrentSubitem");
}
}
}
public MainWindow()
{
InitializeComponent();
this.DataContext = this;
CurrentItem = PossibleItems[0];
CurrentSubitem = PossibleSubitems[0];
}
public event PropertyChangedEventHandler PropertyChanged;
internal void NotifyPropertyChanged(String propertyName = "")
{
if (PropertyChanged != null)
{
PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
}
}
}
}

I rewrote my own sample - kept it code behind so as not to deviate from your sample too much. Also, I'm using .NET 4.5 so didn't have to provide property names in OnPropertyChanged calls - you will need to insert them if on .NET 4.0. This works in all scenarios.
In practice, I'd recommend locating this code in a view-model as per the MVVM pattern. Aside from the binding of the DataContext, It wouldn't look too different from this implemenation though.
using System.Collections.ObjectModel;
using System.ComponentModel;
using System.Runtime.CompilerServices;
using System.Windows;
namespace WpfApplication1
{
public partial class MainWindow: Window, INotifyPropertyChanged
{
private string _currentItem;
private string _currentSubitem;
private ObservableCollection<string> _possibleItems;
private ObservableCollection<string> _possibleSubitems;
public MainWindow()
{
InitializeComponent();
LoadPossibleItems();
CurrentItem = PossibleItems[0];
UpdatePossibleSubItems();
DataContext = this;
CurrentItem = PossibleItems[0];
CurrentSubitem = PossibleSubitems[0];
PropertyChanged += (s, o) =>
{
if (o.PropertyName != "CurrentItem") return;
UpdatePossibleSubItems();
ValidateCurrentSubItem();
};
}
private void ValidateCurrentSubItem()
{
if (!PossibleSubitems.Contains(CurrentSubitem))
{
CurrentSubitem = PossibleSubitems[0];
}
}
public ObservableCollection<string> PossibleItems
{
get { return _possibleItems; }
private set
{
if (Equals(value, _possibleItems)) return;
_possibleItems = value;
OnPropertyChanged();
}
}
public ObservableCollection<string> PossibleSubitems
{
get { return _possibleSubitems; }
private set
{
if (Equals(value, _possibleSubitems)) return;
_possibleSubitems = value;
OnPropertyChanged();
}
}
public string CurrentItem
{
get { return _currentItem; }
private set
{
if (value == _currentItem) return;
_currentItem = value;
OnPropertyChanged();
}
}
public string CurrentSubitem
{
get { return _currentSubitem; }
set
{
if (value == _currentSubitem) return;
_currentSubitem = value;
OnPropertyChanged();
}
}
public event PropertyChangedEventHandler PropertyChanged;
private void LoadPossibleItems()
{
PossibleItems = new ObservableCollection<string>
{
"Item 1",
"Item 2"
};
}
private void UpdatePossibleSubItems()
{
if (CurrentItem == PossibleItems[0])
{
PossibleSubitems = new ObservableCollection<string>
{
"Subitem A",
"Subitem B"
};
}
else if (CurrentItem == PossibleItems[1])
{
PossibleSubitems = new ObservableCollection<string>
{
"Subitem B",
"Subitem C"
};
}
}
protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
{
PropertyChangedEventHandler handler = PropertyChanged;
if (handler != null) handler(this, new PropertyChangedEventArgs(propertyName));
}
}
}

You're notifying the wrong property. On your CurrentItem, you call the "PossibleSubitems".
private string _currentItem;
public string CurrentItem
{
get { return _currentItem; }
set
{
_currentItem = value;
// Changing the item changes the possible sub items
NotifyPropertyChanged("PossibleSubitems");
}
}
Fix that and try again :)
WARNING ... THIS IS A HACK ...
I changed this to make it work (just because I was curious), but this is by no mean the proper way, nor an elegant one:
// List of potential Items, used to populate the options for the Subitems combo box
public ObservableCollection<string> PossibleSubitems { get; set; }
// Track the selected Item
private string _currentItem;
public string CurrentItem
{
get { return _currentItem; }
set
{
_currentItem = value;
// Changing the item changes the possible sub items
if (value == "Item 1")
PossibleSubitems = new ObservableCollection<string>() {"A","B"} ;
else
PossibleSubitems = new ObservableCollection<string>() { "C", "D" };
RaisePropertyChanged("CurrentItem");
RaisePropertyChanged("PossibleSubitems");
}
}
So basically, when current item change, it'll create new collection of subitems ...
UGLY !!! I know ... You could reuse those collections, and do lots of other things ... but as I said, I was curious about if it can be done this way ... :)
If this breaks your keyboard, or your cat runs away, I TAKE NO RESPONSIBILITY WHATSOEVER.

Related

WPF ObservableCollection not updating in ribbon view

I've created a C# WPF app with a RibbonApplicationMenu displaying a Most Recently Used (MRU) list. Unfortunately the display doesn't update when I select an existing file from the list or upload a new file. In the XAML I have:
<local:MostRecentFiles x:Key="MostRecentFilesData" />
...
<ribbon:RibbonApplicationMenu.AuxiliaryPaneContent>
<ribbon:RibbonGallery Name="RecentDocuments" CanUserFilter="False"
SelectedValue="{Binding MostRecentFile, UpdateSourceTrigger=PropertyChanged}">
<ribbon:RibbonGalleryCategory Header="Recent Documents"
ItemsSource="{DynamicResource MostRecentFilesData}">
</ribbon:RibbonGalleryCategory>
</ribbon:RibbonGallery>
</ribbon:RibbonApplicationMenu.AuxiliaryPaneContent>
The DataContext is set to a class containing
private ObservableCollection<string> _mostRecentFile = new ObservableCollection<string>();
public ObservableCollection<string> MostRecentFile
{
get { return _mostRecentFile; }
set
{
_mostRecentFile = value;
OnPropertyChanged("MostRecentFile");
}
}
public event PropertyChangedEventHandler PropertyChanged;
protected virtual void OnPropertyChanged(string propertyName)
{
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}
In the OpenFile routine the code is
MostRecentFiles mrf = new MostRecentFiles();
mrf.AddMRUitem(openFileDlg.FileName);
The MostRecentFiles class contains the main class methods and I've put some sample file paths in the code.
public class MostRecentFiles : ObservableCollection<string>
{
public ObservableCollection<string> MRUmenuItems = new ObservableCollection<string>();
public MostRecentFiles()
{
AddMRUitem(#"C:\MyDocuments\File3.txt"); //
AddMRUitem(#"C:\MyDocuments\File2.txt"); // } Sample files
AddMRUitem(#"C:\MyDocuments\File1.txt"); //
}
public void AddMRUitem(string filePath)
{
int result;
result = MRUmenuItems.IndexOf(filePath);
if (result != -1)
{
MRUmenuItems.Remove(filePath);
MRUmenuItems.Insert(0, filePath);
}
else
AddMenuItem(filePath);
UpdateMRUList();
}
private void UpdateMRUList()
{
this.Clear();
foreach (string filePath in MRUmenuItems)
{
this.Add(filePath);
}
//OnPropertyChanged("MostRecentFile"); // <= Error CS1503
}
private void AddMenuItem(string newMRUfile)
{
MRUmenuItems.Insert(0, newMRUfile);
if (MRUmenuItems.Count > 10)
{
MRUmenuItems.RemoveAt(MRUmenuItems.Count - 1);
}
}
private string _mostRecentFile = "";
public string MostRecentFile
{
get { return _mostRecentFile; }
set
{
if (_mostRecentFile == value) return;
_mostRecentFile = value;
AddMRUitem(_mostRecentFile);
//OnPropertyChanged("MostRecentFile");
}
}
}
Undeleting OnPropertyChanged in UpdateMRUList() produces the error: Error CS1503 Argument 1: cannot convert from 'string' to 'System.ComponentModel.PropertyChangedEventArgs'
When I launch the program the menu correctly displays the three files but when I select one the displayed order doesn't change; I expect the selected file to move to the top of the list. Similarly when I open a new file the filename isn't added to the MRU.
However if I step through the code the lists are being updated in the correct order. What have I done wrong?
You are binding SelectedValue to a collection. You don't need a custom collection. Just add an ObservableCollection to your view model and move items on selected item changed:
View model:
private void OnSelectedMostRecentFileChanged()
{
// Move the selected item to the front of the list
this.MostRecentFiles.Move(this.MostRecentFiles.IndexOf(this.SelectedRecentFile), 0);
}
private string _selectedRecentFile;
public string SelectedRecentFile
{
get { return _selectedRecentFile; }
set
{
_selectedRecentFile= value;
OnSelectedMostRecentFileChanged();
OnPropertyChanged(nameof(SelectedRecentFile));
}
}
private ObservableCollection<string> _mostRecentFiles = new ObservableCollection<string>();
public ObservableCollection<string> MostRecentFiles
{
get { return _mostRecentFiles; }
set
{
_mostRecentFiles = value;
OnPropertyChanged(nameof(MostRecentFiles));
}
}
View:
<ribbon:RibbonApplicationMenu.AuxiliaryPaneContent>
<ribbon:RibbonGallery Name="RecentDocuments" CanUserFilter="False"
SelectedItem="{Binding SelectedRecentFile}">
<ribbon:RibbonGalleryCategory Header="Recent Documents"
ItemsSource="{Binding MostRecentFiles}">
</ribbon:RibbonGalleryCategory>
</ribbon:RibbonGallery>
</ribbon:RibbonApplicationMenu.AuxiliaryPaneContent>

custom search for combobox

I am creating a WPF app containing a ComboBox which shows some data. I want to use the combobox-integrated text seach. But the problem is, if the user searchs for "llo", the list should show all items, containing this text snippet, like "Hallo", "Hello", "Rollo" ... But the search returns no result because the property name of no item starts with "llo". Has somebody an idea how to achieve this?
I am using the MVVM-pattern. The view is binded to a collection of DTOs (property of the viewmodel), in the DTO there are two properties which are relevant for the search.
<ComboBox
ItemsSource="{Binding Path=Agencies}"
SelectedItem="{Binding Path=SelectedAgency}"
IsTextSearchEnabled="True"
DisplayMemberPath="ComboText"
IsEnabled="{Binding IsReady}"
IsEditable="True"
Grid.Column="0"
Grid.Row="0"
IsTextSearchCaseSensitive="False"
HorizontalAlignment="Stretch">
</ComboBox>
public class Agency
{
public int AgencyNumber { get; set; }
public string Title { get; set; }
public string Name { get; set; }
public string ContactPerson { get; set; }
public string ComboText => $"{this.AgencyNumber}\t{this.Name}";
}
Ginger Ninja | Kelly | Diederik Krols definitely provide a nice all in one solution, but it may be a tad on the heavy side for simple use cases. For example, the derived ComboBox gets a reference to the internal editable textbox. As Diederik points out "We need this to get access to the Selection.". Which may not be a requirement at all. Instead we could simply bind to the Text property.
<ComboBox
ItemsSource="{Binding Agencies}"
SelectedItem="{Binding SelectedAgency}"
Text="{Binding SearchText}"
IsTextSearchEnabled="False"
DisplayMemberPath="ComboText"
IsEditable="True"
StaysOpenOnEdit="True"
MinWidth="200" />
Another possible improvement is to expose the filter, so devs could easily change it. Turns out this can all be accomplished from the viewmodel. To keep things interesting I chose to use the Agency's ComboText property for DisplayMemberPath, but its Name property for the custom filter. You could, of course, tweak this however you like.
public class MainViewModel : ViewModelBase
{
private readonly ObservableCollection<Agency> _agencies;
public MainViewModel()
{
_agencies = GetAgencies();
Agencies = (CollectionView)new CollectionViewSource { Source = _agencies }.View;
Agencies.Filter = DropDownFilter;
}
#region ComboBox
public CollectionView Agencies { get; }
private Agency selectedAgency;
public Agency SelectedAgency
{
get { return selectedAgency; }
set
{
if (value != null)
{
selectedAgency = value;
OnPropertyChanged();
SearchText = selectedAgency.ComboText;
}
}
}
private string searchText;
public string SearchText
{
get { return searchText; }
set
{
if (value != null)
{
searchText = value;
OnPropertyChanged();
if(searchText != SelectedAgency.ComboText) Agencies.Refresh();
}
}
}
private bool DropDownFilter(object item)
{
var agency = item as Agency;
if (agency == null) return false;
// No filter
if (string.IsNullOrEmpty(SearchText)) return true;
// Filtered prop here is Name != DisplayMemberPath ComboText
return agency.Name.ToLower().Contains(SearchText.ToLower());
}
#endregion ComboBox
private static ObservableCollection<Agency> GetAgencies()
{
var agencies = new ObservableCollection<Agency>
{
new Agency { AgencyNumber = 1, Name = "Foo", Title = "A" },
new Agency { AgencyNumber = 2, Name = "Bar", Title = "C" },
new Agency { AgencyNumber = 3, Name = "Elo", Title = "B" },
new Agency { AgencyNumber = 4, Name = "Baz", Title = "D" },
new Agency { AgencyNumber = 5, Name = "Hello", Title = "E" },
};
return agencies;
}
}
The main gotchas:
When the user enters a search and then selects an item from the filtered list, we want SearchText to be updated accordingly.
When this happens, we don't want to refresh the filter. For this demo, we're using a different property for DisplayMemberPath and our custom filter. So if we would let the filter refresh, the filtered list would be empty (no matches are found) and the selected item would be cleared as well.
On a final note, if you specify the ComboBox's ItemTemplate, you'll want to set TextSearch.TextPath instead of DisplayMemberPath.
If you refer to this answer
This should put you in the correct direction. It operated in the manner i believe you need when i tested it. For completeness ill add the code:
public class FilteredComboBox : ComboBox
{
private string oldFilter = string.Empty;
private string currentFilter = string.Empty;
protected TextBox EditableTextBox => GetTemplateChild("PART_EditableTextBox") as TextBox;
protected override void OnItemsSourceChanged(IEnumerable oldValue, IEnumerable newValue)
{
if (newValue != null)
{
var view = CollectionViewSource.GetDefaultView(newValue);
view.Filter += FilterItem;
}
if (oldValue != null)
{
var view = CollectionViewSource.GetDefaultView(oldValue);
if (view != null) view.Filter -= FilterItem;
}
base.OnItemsSourceChanged(oldValue, newValue);
}
protected override void OnPreviewKeyDown(KeyEventArgs e)
{
switch (e.Key)
{
case Key.Tab:
case Key.Enter:
IsDropDownOpen = false;
break;
case Key.Escape:
IsDropDownOpen = false;
SelectedIndex = -1;
Text = currentFilter;
break;
default:
if (e.Key == Key.Down) IsDropDownOpen = true;
base.OnPreviewKeyDown(e);
break;
}
// Cache text
oldFilter = Text;
}
protected override void OnKeyUp(KeyEventArgs e)
{
switch (e.Key)
{
case Key.Up:
case Key.Down:
break;
case Key.Tab:
case Key.Enter:
ClearFilter();
break;
default:
if (Text != oldFilter)
{
RefreshFilter();
IsDropDownOpen = true;
}
base.OnKeyUp(e);
currentFilter = Text;
break;
}
}
protected override void OnPreviewLostKeyboardFocus(KeyboardFocusChangedEventArgs e)
{
ClearFilter();
var temp = SelectedIndex;
SelectedIndex = -1;
Text = string.Empty;
SelectedIndex = temp;
base.OnPreviewLostKeyboardFocus(e);
}
private void RefreshFilter()
{
if (ItemsSource == null) return;
var view = CollectionViewSource.GetDefaultView(ItemsSource);
view.Refresh();
}
private void ClearFilter()
{
currentFilter = string.Empty;
RefreshFilter();
}
private bool FilterItem(object value)
{
if (value == null) return false;
if (Text.Length == 0) return true;
return value.ToString().ToLower().Contains(Text.ToLower());
}
}
The XAML I used to test:
<Window x:Class="CustomComboBox.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:CustomComboBox"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<Window.DataContext>
<local:MainWindowVM/>
</Window.DataContext>
<Grid>
<local:FilteredComboBox IsEditable="True" x:Name="MyThing" HorizontalAlignment="Center" VerticalAlignment="Center"
Height="25" Width="200"
ItemsSource="{Binding MyThings}"
IsTextSearchEnabled="True"
IsEnabled="True"
StaysOpenOnEdit="True">
</local:FilteredComboBox>
</Grid>
My ViewModel:
public class MainWindowVM : INotifyPropertyChanged
{
private ObservableCollection<string> _myThings;
public ObservableCollection<string> MyThings { get { return _myThings;} set { _myThings = value; RaisePropertyChanged(); } }
public MainWindowVM()
{
MyThings = new ObservableCollection<string>();
MyThings.Add("Hallo");
MyThings.Add("Jello");
MyThings.Add("Rollo");
MyThings.Add("Hella");
}
public event PropertyChangedEventHandler PropertyChanged;
protected void RaisePropertyChanged([CallerMemberName] string propertyName = "")
{
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}
}
If it doesnt meet your exact needs im sure you can edit it. Hope this helps.
Use the .Contains method.
This method will return true if the string contains the string you pass as a parameter.
Else it will return false.
if(agency.Title.Contains(combobox.Text))
{
//add this object to the List/Array that contains the object which will be shown in the combobox
}

WPF combo box not binding on change

I have 3 combo boxes
<Grid>
<ComboBox Name="cbo1" SelectionChanged="OnComboBoxChanged" />
<ComboBox Name="cbo2" SelectionChanged="OnComboBoxChanged"/>
<ComboBox Name="cbo3" SelectionChanged="OnComboBoxChanged" />
The list for combo boxes is { a,b,c,d}
so if "b" is selected in the first box then the drop down should not have b and it will need to updated with {a,c,d} if the second one is set to a then last one need to have {c,d}. if they go back and change any we need to update the list accordingly. I addded a event oncomboboxchanged but it is not updating the combo box , when i set the item source to the new list.
private List<string> comboList = new List<string>();
string[] defaultParam = { "A", "B", "C", "D" };
public MainWindow()
{
InitializeComponent();
foreach(string s in defaultParam)
{
LoadCombo(s);
}
}
public void LoadCombo(string name)
{
comboList.Add(name);
cbo1.ItemsSource = comboList;
cbo2.ItemsSource = comboList;
cbo3.ItemsSource = comboList;
}
private void OnComboBoxChanged(object sender,SelectionChangedEventArgs e)
{
var combo = sender as ComboBox;
string oldval = combo.Text;
string id = combo.Name;
string itemSel = (sender as ComboBox).SelectedItem.ToString();
comboList.Remove(itemSel);
//add old value only if it is not empty
if (!string.IsNullOrEmpty(oldval))
{
comboList.Add(oldval);
}
combo.ItemsSource = comboList;
ComboBox[] comboNameLst = {cbo1,cbo2,cbo3 };
foreach (ComboBox cbo in comboNameLst)
{
if (id != cbo.Name)
{
if (cbo.SelectedItem == null)
{
cbo.ItemsSource = comboList;
}
else if (cbo.SelectedItem != null)
{
string tempitemsel = cbo.SelectedItem.ToString();
comboList.Add(tempitemsel);
cbo.ItemsSource = comboList;
comboList.Remove(tempitemsel);
}
}
}
}
so cbo.ItemSource is not doing any thing , do I need to do any thing differently so I see the update.
You need to use binding in XAML, rather than set ItemsSource in your code behind. Also data bind SelectedItem:
<Grid>
<ComboBox ItemsSource="{Binding DefaultList}" SelectedItem="{Binding SelectedItem_Cob1}"/>
<ComboBox ItemsSource="{Binding FilteredListA}" SelectedItem="{Binding SelectedItem_Cob2}"/>
<ComboBox ItemsSource="{Binding FilteredListB}" SelectedItem="{Binding SelectedItem_Cob3}"/>
</Grid>
In your code behind, you need to implement INotifyPropertyChanged; define your relevant ItemsSources, and SlectedItems as properties; and set your Windows's DataContext to your code itself (you should use MVVM pattern but you could worry about that later) :
using System.ComponentModel;
public partial class MainWindow: INotifyPropertyChanged
{
string[] defaultParam = { "A", "B", "C", "D" };
private string _selecteditem_cob1;
private string _selecteditem_cob2;
private string _selecteditem_cob3;
public List<string> DefaultList
{
get { return defaultParam.ToList(); }
}
public string SelectedItem_Cob1
{
get { return _selecteditem_cob1; }
set
{
if (_selecteditem_cob1 != value)
{
_selecteditem_cob1 = value;
RaisePropertyChanged("SelectedItem_Cob1");
RaisePropertyChanged("FilteredListA");
RaisePropertyChanged("FilteredListB");
}
}
}
public string SelectedItem_Cob2
{
get { return _selecteditem_cob2; }
set
{
if (_selecteditem_cob2 != value)
{
_selecteditem_cob2 = value;
RaisePropertyChanged("SelectedItem_Cob2");
RaisePropertyChanged("FilteredListB");
}
}
}
public string SelectedItem_Cob3
{
get { return _selecteditem_cob3; }
set
{
if (_selecteditem_cob3 != value)
{
_selecteditem_cob3 = value;
RaisePropertyChanged("SelectedItem_Cob3");
}
}
}
public List<string> FilteredListA
{
get { return defaultParam.ToList().Where(a=>a!=SelectedItem_Cob1).ToList(); }
}
public List<string> FilteredListB
{
get { return FilteredListA.Where(a => a != SelectedItem_Cob2).ToList(); }
}
public MainWindow()
{
InitializeComponent();
this.DataContext=this;
}
//Implementation for INotifyPropertyChanged
public event PropertyChangedEventHandler PropertyChanged;
protected virtual void OnPropertyChanged(PropertyChangedEventArgs e)
{
var handler = this.PropertyChanged;
if (handler != null)
{
handler(this, e);
}
}
protected void RaisePropertyChanged(String propertyName)
{
OnPropertyChanged(new PropertyChangedEventArgs(propertyName));
}
}
Result:
Three ComboBoxes will all show A,B,C,D at the initial stage. And
then if user made selections cbo2 and cbo3 will only display
filtered result dynamically.
I realized this is not 100% what you want (thanks to #TheodosiusVonRichthofen), but I feel you can still use this, and be able to easily modify it to suit your needs.
Also, the list that contains the combo-box items should be an ObservableCollection instead of a List. By making it an ObservableCollection, the combo-box items will be updated when you add/remove/change items in the lists.

Removing ObservableCollection Item

I have created an ObservableCollection and binded that to my Listview. Before my items are loaded into the ListView they are being sorted using Linq and then added to the ListView:
//Get's the Items and sets it
public ObservableCollection<ItemProperties> ItemCollection { get; private set; }
//Orders the Items alphabetically using the Title property
DataContext = ItemCollection.OrderBy(x => x.Title);
<!--ItemCollection has been binded to the ListView-->
<ListView ItemsSource="{Binding}"/>
The problem I'm having is that I can't remove a selected item from the collection. The problem occurs only if I add the DataContext = ItemCollection.OrderBy(x => x.Title);. If it's DataContext = ItemCollection then I can delete the selected item.
My delete method gets activated once the ContextMenu (MenuFlyout) is being opened and the 'Delete' item is clicked. My delete method is:
private void btn_Delete_Click(object sender, RoutedEventArgs e)
{
var edit_FlyOut = sender as MenuFlyoutItem;
var itemProperties = edit_FlyOut.DataContext as ItemProperties;
ItemCollection.Remove(itemProperties);
}
This is my ItemProperties class:
public class ItemProperties : INotifyPropertyChanged
{
public event PropertyChangedEventHandler PropertyChanged;
public ItemProperties() { }
private string m_Title;
public string Title
{
get { return m_Title; }
set
{
m_Title = value;
OnPropertyChanged("Title");
}
}
private string m_Post;
public string Post
{
get { return m_Post; }
set
{
m_Post = value;
OnPropertyChanged("Post");
}
}
private string m_Modified;
public string Modified
{
get { return m_Modified; }
set
{
m_Modified = value;
OnPropertyChanged("Modified");
}
}
private string m_ID;
public string ID
{
get { return m_ID; }
set
{
m_ID = value;
OnPropertyChanged("ID");
}
}
protected void OnPropertyChanged(string name)
{
PropertyChangedEventHandler handler = this.PropertyChanged;
if (handler != null)
handler(this, new PropertyChangedEventArgs(name));
}
}
Edit
How I load my Items:
public async void GetList()
{
var AppStorage = ApplicationData.Current.LocalFolder;
var noteFolders = await AppStorage.GetFolderAsync(#"folder\files\");
var Folders = await noteFolders.GetFoldersAsync();
ItemCollection = new ObservableCollection<ItemProperties>();
foreach (var noteFolder in Folders)
{
ItemCollection.Add(new ItemProperties { Title = readTitle, Post = readBody, ID = noteFolder.Name, Modified = timeFormat });
}
//code which readers and adds text to the properties...
DataContext = ItemCollection.OrderBy(x => x.Title);
}
You can get selected item from ListView and delete it:
if (lvElement.SelectedIndex == -1) return;
ItemProperties selectedProperty = (ItemProperties)lvElement.SelectedItem;
// remove selectedProperty from original collection
My solution is:
ItemCollection = new ObservableCollection<ItemProperties>(ItemCollection.OrderBy(a => a.Title));
DataContext = ItemCollection;
It seemed like I had to reinitialize the ItemCollection to a new ObservableCollection and order it all in one go rather than loading the items then sorting. What this did was it had one list which was first adding the items then the other list which had to sort. To avoid this I had do to it all in one go. Above helped me. I got it from here.

How to bind ComboBox properly in WPF?

I'm new to WPF and MVVM and I'm developing a test WPF application following the MVVM design pattern. My database has 2 entities, Cards and Departments. Any card can have only 1 department, so it's a one-to-many relationship.
I've created the following ViewModel in order to bind to the view:
public class CardViewModel : INotifyPropertyChanged
{
public CardViewModel(Card card)
{
this.Card = card;
SqlConnectionStringBuilder builder = new SqlConnectionStringBuilder();
builder.DataSource = ".\\SQLExpress";
builder.InitialCatalog = "TESTDB";
builder.IntegratedSecurity = true;
SybaseDatabaseContext myDB = new SybaseDatabaseContext(builder.ConnectionString);
var query = from d in myDB.Departments
select d;
this.Departments = new ObservableCollection<Department>(query);
}
private Card _Card;
private ObservableCollection<Department> _Departments;
public Card Card
{
get { return _Card; }
set
{
if (value != this._Card)
{
this._Card = value;
SendPropertyChanged("Card");
}
}
}
public ObservableCollection<Department> Departments
{
get { return _Departments; }
set
{
this._Departments = value;
SendPropertyChanged("Departments");
}
}
#region INPC
// Logic for INotify interfaces that nootify WPF when change happens
public event PropertyChangedEventHandler PropertyChanged;
protected virtual void SendPropertyChanged(String propertyName)
{
if ((this.PropertyChanged != null))
{
this.PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
}
}
#endregion
}
The CardForms' datacontext is currently being set to an instance of the CardViewModel in the code where the CardForm is being instantiated, but I'm going to create a IoC container or dependency injections down the line.
Everything binds correctly except for the ComboBox that should contain all departments and that has the current department in the Card instance selected (card.Department). Here's the XAML for the ComboBox:
<ComboBox Height="23" HorizontalAlignment="Left" Margin="350,64,0,0"
Name="comboBoxDepartment" VerticalAlignment="Top" Width="120"
IsSynchronizedWithCurrentItem="True"
ItemsSource="{Binding Path=Departments}"
DisplayMemberPath="DepartmentName"
SelectedItem="{Binding Path=Card.Department, Mode=TwoWay}" />
The departments are displayed in the combobox, but the current department of the card isn't and if I try to change it I get and error saying "Cannot add an entity with a key that is already in use".
So, my question is, how do I bind this combobox correctly to my ViewModel?
P.S. I know populating the ObservableCollection<Department> in the ViewModel is probably not the right way to do it, but I could not think of a better way at the time. If you have any suggestions for this also, please let me know.
Additionally, this is the Card model:
[Table(Name = "Card")]
public class Card : INotifyPropertyChanged, INotifyPropertyChanging
{
private string _CardID;
private string _Holder;
private Int16? _DepartmentNo;
[Column(UpdateCheck = UpdateCheck.WhenChanged)]
public string CardID
{
get
{
return this._CardID;
}
set
{
if (value != this._CardID)
{
SendPropertyChanging();
this._CardID = value;
SendPropertyChanged("CardID");
}
}
}
[Column(UpdateCheck = UpdateCheck.WhenChanged)]
public string Holder
{
get
{
return this._Holder;
}
set
{
if (value != this._Holder)
{
SendPropertyChanging();
this._Holder = value;
SendPropertyChanged("Holder");
}
}
}
[Column(CanBeNull = true, UpdateCheck = UpdateCheck.WhenChanged)]
public Int16? DepartmentNo
{
get
{
return this._DepartmentNo;
}
set
{
if (value != this._DepartmentNo)
{
SendPropertyChanging();
this._DepartmentNo = value;
SendPropertyChanged("DepartmentNo");
}
}
}
private EntityRef<Department> department;
[Association(Storage = "department", ThisKey = "DepartmentNo", OtherKey = "DepartmentNo", IsForeignKey = true)]
public Department Department
{
get
{
return this.department.Entity;
}
set
{
Department previousValue = this.department.Entity;
if (((previousValue != value)
|| (this.department.HasLoadedOrAssignedValue == false)))
{
this.SendPropertyChanging();
if ((previousValue != null))
{
this.department.Entity = null;
previousValue.Cards.Remove(this);
}
this.department.Entity = value;
if ((value != null))
{
value.Cards.Add(this);
this._DepartmentNo = value.DepartmentNo;
}
else
{
this._DepartmentNo = default(Nullable<short>);
}
this.SendPropertyChanged("Department");
}
}
}
I edited the constructor in the CardViewModel to take the DataContext as a parameter and that did it. This is the new CardViewModel constructor:
public CardViewModel(Card card, SybaseDatabaseContext myDB)
{
this.Card = card;
var query = from d in myDB.Departments
select d;
this.Departments = new ObservableCollection<Department>(query);
}
Had to do a bit of research on this myself. Thought I would contribute with a self answered question, but found this open current question...
The ComboBox is designed to be a kind of textbox that restricts it's possible values to the contents of a given list. The list is provided by the ItemsSource attribute. The current value of the ComboBox is the SelectedValue property. Typically these attributes are bound to relevant properties of a corresponding ViewModel.
The following example shows wired ComboBox together with a TextBox control used to redundantly view the current value of the ComboBox by sharing a view model property. (It is interesting to note that when TextBox changes the shared property to a value outside the scope of the ComboBox's list of values, the ComboBox displays nothing.)
Note: the following WPF/C# example does does use code-behind and so presents the ViewModel as merely the datacontext of the view and not a partial class of it, a current implementation constraint when using WPF with F#.
WPF XAML
<Window
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:m="clr-namespace:WpfApplication1"
Title="MainWindow" Height="350" Width="525">
<Window.DataContext>
<m:MainWindowVM />
</Window.DataContext>
<StackPanel>
<TextBox Text="{Binding SelectedString}" />
<ComboBox ItemsSource="{Binding MyList}" SelectedValue="{Binding SelectedString}" />
</StackPanel>
</Window>
C# ViewModel
using System.Collections.Generic;
using System.ComponentModel;
namespace WpfApplication1
{
public class MainWindowVM : INotifyPropertyChanged
{
string selectedString;
void NotifyPropertyChanged(string propertyName)
{
if (PropertyChanged == null) return;
PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
}
public string SelectedString
{
get { return selectedString; }
set
{
selectedString = value;
NotifyPropertyChanged("SelectedString");
}
}
public List<string> MyList
{
get { return new List<string> { "The", "Quick", "Brown", "Fox" }; }
}
public event PropertyChangedEventHandler PropertyChanged;
}
}
By default, ToString() is used to interpret the objects in the list. However, ComboBox offers DisplayMemberPath and SelectedValuePath attributes for specifying paths to specific object properties for corresponding displayed and stored values. These paths are relative to the list object element so a path of "Name" refers to Name on a list object item.
The "Remarks" section of this MSDN link explains the interpretations of the IsEditable and IsReadOnly ComboBox properties.

Categories

Resources