I am trying to bind a ComboBox, which have two categories (Letters
and Numbers), to a Listbox.
Here is the C# Code:
class LibraryViewModel
{
public LetterOrNumberList lib { get; }
public LibraryViewModel()
{
lib = new LetterOrNumberList();
}
}
public class LetterOrNumberList : ObservableCollection<LettersAndNumbers>
{
public LetterOrNumberList()
{
LettersAndNumbers Letters = new LettersAndNumbers();
Letters.Title = "Letters";
ObservableCollection<IExample> letters = new ObservableCollection<IExample>();
letters.Add(new LetterA());
letters.Add(new LetterB());
Letters.LetterOrNumber = letters;
LettersAndNumbers Numbers = new LettersAndNumbers();
Numbers.Title = "Numbers";
ObservableCollection<IExample> numbers = new ObservableCollection<IExample>();
numbers.Add(new Number1());
numbers.Add(new Number2());
Numbers.LetterOrNumber = numbers;
this.Add(Letters);
this.Add(Numbers);
}
}
public class LettersAndNumbers
{
public string Title { get; set; }
public ObservableCollection<IExample> LetterOrNumber { get; set; }
}
public class LetterA : PropertyChangeClass, IExample
{
public string value
{
get
{
return _value;
}
set
{
_value = value;
OnPropertyChanged(nameof(value));
}
}
public LetterA()
{
value = "A";
}
private string _value;
}
public class LetterB : PropertyChangeClass, IExample
{
//principial the same like class Letter A
//...
}
public class Number1 : PropertyChangeClass, IExample
{
//principial the same like class Letter A
//...
}
public class Number2 : PropertyChangeClass, IExample
{
//principial the same like class Letter A
//...
}
public class PropertyChangeClass
{
public event PropertyChangedEventHandler PropertyChanged;
protected virtual void OnPropertyChanged(string PropertyName)
{
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(PropertyName));
}
}
public interface IExample
{
string value { get; set; }
}
And in XAML I tried it as following:
<ComboBox Width="100" Name="cBox" Text="Bitte auswählen" ItemsSource="{Binding lib}" DisplayMemberPath="Title"/>
<ListBox Grid.Row="2" ItemsSource="{Binding cBox}" DisplayMemberPath="value"/>
The ComboBox binding works but I dont know how to bind the
nested "value" property in dependency of the selecteditem.
ComboBox
Maybe someone know how to solve. Thanks!
EDIT:
I've a library of different products. Each product is to a category assigned. At the end the user should select a category and the products of it will be dynamically displayed (in a ListBox). I ve sorted it in a observablecollection that Ive the same structure like the code above.
I finally get it:
<ListBox Grid.Row="2" ItemsSource="{Binding ElementName=cBox, Path=SelectedItem.LetterOrNumber, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid>
<TextBlock Text="{Binding Path=value}"/>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Related
when typing in the textbox and click "Add Employee", i want it to update and display to the datagrid, i've implemented INotifyPropertyChanged and RelayCommand. what am i missing that's not populating the data. thanks in advance
here is my model
public class EmployeeModel
{
public string Name { get; set; }
public int Pedicure { get; set; }
public int Tip { get; set; }
public int Total { get; set; }
}
this is my ViewModel
List<EmployeeModel> employeeModel = new List<EmployeeModel>() { };
private ICommand _addEmployeeCommand;
public ICommand AddEmployeeCommand
{
get
{
return _addEmployeeCommand ?? (_addEmployeeCommand = new RelayCommand(x => { AddNewEmployee(); }));
}
}
public List<EmployeeModel> Employee
{
get { return employeeModel; }
set
{
if(value != employeeModel)
{
employeeModel = value;
OnPropertyChanged("Employee");
}
}
}
private string employeeName;
public string EmployeeName
{
get { return employeeName; }
set
{
if (value != employeeName)
{
employeeName = value;
OnPropertyChanged("EmployeeName");
}
}
}
public void AddNewEmployee()
{
Employee.Add(new EmployeeModel { Name = EmployeeName });
}
here is my View
<TabItem Header="Employee">
<StackPanel Orientation="Vertical">
<DataGrid ItemsSource="{Binding Employee}">
</DataGrid>
<StackPanel Orientation="Horizontal">
<TextBlock Text="Name: "/>
<TextBox Text="{Binding EmployeeName}"
Width="40"
Height="15"
VerticalAlignment="Top"/>
<Button Content="Add"
Command="{Binding AddEmployeeCommand}"
Height="20"
VerticalAlignment="Top"/>
</StackPanel>
</StackPanel>
(I pluralized the name Employee to Employees in this answer for future readers)
The problem is with the Source of the DataGrid
Bear in mind that OnPropertyChanged("Employees") only notifies about the changes made to the Employees and is not responsible for any changes made within Employees.
To be clear, it only works when you do employeeModels = new List<EmployeeModel>()
And won't be called when Employees.Add(employee)
Hopefully WPF has its own ObservableCollection type that will take care of that:
private ObservableCollection<Employee> _employees = new ObservableCollection<Employee>;
public ObservableCollection<Employee> Employees { get { return _employees; } }
Hello I can't seem to figure out why my combox stays empty :/
On page load the first combox gets populated with countries (from JSON), the second combobox should populate when a country is selected in the first combobox. I'm trying to fetch the SelectedItem (country) as string in a property ... SelectedItem is of type ComboBoxItem ? I think that is where it goes wrong.
The (view)model where the sorting bindable properties are:
public class LocalityModel : NotifyProp
{
#region properties
private static List<LocalityJSON> dataList;
public List<LocalityJSON> DataList
{
get
{
return dataList;
}
set {
dataList = value;
RaisePropertyChanged("Landen");
RaisePropertyChanged("Gewesten");
}
}
public List<string> Landen
{
get { if (DataList == null) return null; return (from s in DataList orderby s.Land select s.Land).Distinct().ToList<string>(); }
}
public string SelectedLand { get; set; }
public List<string> Gewesten {
get { if (DataList == null) return null; return (from s in DataList where s.Land.Equals(SelectedLand) select s.Gewest).Distinct().ToList<string>(); }
}
#endregion
#region ctor
public LocalityModel()
{
FillDataList();
}
#endregion
#region methodes
public async void FillDataList()
{
if (DataList == null)
{
DataList = await EVNT.Entries();
}
}
#endregion
}
MainPage XAML (the bindings):
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" DataContext="{Binding Source={StaticResource LocalityModel}}">
...
<TextBlock x:Name="txbCountry" Style="{StaticResource InfoLabelCountry}" />
<ComboBox x:Name="cboCountry" Style="{StaticResource CountryBox}" ItemsSource="{Binding Landen}" SelectedItem="{Binding SelectedLand, Mode=TwoWay}" />
<TextBlock x:Name="txbGewest" Style="{StaticResource InfoLabelGewest}" />
<ComboBox x:Name="cboGewest" Style="{StaticResource GewestBox}" ItemsSource="{Binding Gewesten}" />
INotifyPropertyChanged:
public class NotifyProp : INotifyPropertyChanged
{
public event PropertyChangedEventHandler PropertyChanged;
public void RaisePropertyChanged(string propertyName)
{
if (PropertyChanged != null) PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
}
}
The model for the JSON:
public class LocalityJSON
{
public string FB_ID { get; set; }
public string Land { get; set; }
public string Gewest { get; set; }
public string City { get; set; }
}
The JSON deserialisation (less important for the question):
public class EVNT
{
public async static Task<List<LocalityJSON>> Entries()
{
using (var client = new HttpClient())
{
client.BaseAddress = new Uri(#"http://e-vnt.com/admin/core/api/");
HttpResponseMessage response = await client.GetAsync("localityApi");
if (response.IsSuccessStatusCode)
{
String s = await response.Content.ReadAsStringAsync();
List<LocalityJSON> entries = JsonConvert.DeserializeObject<List<LocalityJSON>>(s);
return entries;
}
else
return null;
}
}
}
In your SelectedLand Property setter you need to fire PropertyChanged event the for both SelectedLand and for Gewesten.
It would probably look something like this
private string _SelectedLand;
public string SelectedLand
{
get
{
return _SelectedLand;
}
set
{
_SelectedLand = value;
RaisePropertyChanged("SelectedLand");
RaisePropertyChanged("Gewesten");
}
}
if you don't fire PropertyChanged event for Gewesten then that combobox will not know to reload is values.
I made an example as simple as possible.
I have a class ViewModelMain whose will implement several viewmodels.
I am trying to bind my slider value on a viewmodel in my ViewModelMain.
Here my code:
MainWindow.xaml.cs
I set the datacontext here, don't know if it is realy a good idea.
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
VMMain vm = new VMMain();
this.DataContext = vm;
}
}
MainWindow.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="350" Width="525">
<Grid>
<Slider Height="23" Name="page_slider" Width="100" Value="{Binding Path=p.NbrLine}" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Minimum="0" Maximum="10"/>
<TextBox Text="{Binding Value, ElementName=page_slider, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" Height="28" HorizontalAlignment="Stretch" Name="Voiture1Label" VerticalAlignment="Stretch" Margin="0,110,0,172"></TextBox>
</Grid></Window>
ViewModelMain.cs
ViewModelBase : the class which implement the INotifyPropertyChanged
ModelPage : my model
MyPage : my sub viewmode which is the viewmodel of ModelPage
ViewModelMain : my final viewmodel which will implement more viewmodel
public class ViewModelBase : INotifyPropertyChanged
{
public event PropertyChangedEventHandler PropertyChanged;
protected virtual void OnPropertyChanged(string propName)
{
if (PropertyChanged != null)
{
PropertyChanged(this, new PropertyChangedEventArgs(propName));
}
}
}
public class ModelPage
{
public int NbrLine { get; set; }
public int NbrCapsLock { get; set; }
}
public class MyPage : ViewModelBase
{
private ModelPage _model;
public MyPage(ModelPage m)
{
_model = m;
}
public int NbrLine
{
get { return (_model.NbrLine); }
set
{
if (_model.NbrLine == value) return;
_model.NbrLine = value;
OnPropertyChanged("NbrLine");
}
}
public int NbrCapsLock
{
get { return (_model.NbrCapsLock); }
set
{
if (_model.NbrCapsLock == value) return;
_model.NbrCapsLock = value;
OnPropertyChanged("NbrCapsLock");
}
}
}
public class ViewModelMain
{
public MyPage p;
public ViewModelMain()
{
p = new MyPage(new ModelPage(){NbrLine = 5, NbrCapsLock = 1});
}
}
when i launch it, my slider is still on 0 doesn't understand why it is not on 5.
p is a field, not a property. You should only bind to properties:
public MyPage p { get; set; }
Actually you chould transform p into property like that. WPF can not bind to simple attributes.
public class ViewModelMain
{
public MyPage p { get; set; }
public ViewModelMain()
{
p = new MyPage(new ModelPage() { NbrLine = 5, NbrCapsLock = 1 });
}
}
I want to create a databinding on a TreeView with the following model:
public partial class MainWindow : Window
{
private ViewModel model = new ViewModel();
public MainWindow()
{
InitializeComponent();
DataContext = model;
}
...
}
public class ViewModel : ObservableObject
{
private IList<Document> sourceDocuments;
public IList<Document> SourceDocuments
{
get { return sourceDocuments; }
set
{
sourceDocuments = value;
OnPropertyChanged("SourceDocuments");
}
}
public ViewModel()
{
SourceDocuments = new ObservableCollection<Document>();
}
}
public class Document
{
public String Filename;
public IList<DocumentBlock> Blocks { get; set; }
public Document(String filename)
{
this.Filename = filename;
Blocks = new List<DocumentBlock>();
}
}
public class DocumentBlock
{
public String Name { get; private set; }
public DocumentBlock(String name)
{
this.Name = name;
}
public override string ToString()
{
return Name;
}
}
And this XAML
<TreeView HorizontalAlignment="Left" Margin="6,6,0,6" Name="SourceDocumentsList" Width="202"
ItemsSource="{Binding SourceDocuments}">
<TreeView.ItemTemplate>
<HierarchicalDataTemplate ItemsSource="{Binding /Blocks}">
<TextBlock Text="{Binding /Name}" />
</HierarchicalDataTemplate>
</TreeView.ItemTemplate>
</TreeView>
I get the error message 'Blocks' property not found on 'current item of collection' ''Document'. Why is this?
You should drop the /, the DataContext in the ItemTemplate is an item, it has no current item itself. Also the Name binding won't work, as the DataContext is still a Document, you can specify the HierarchicalDataTemplate.ItemTemplate, there the DataContext is a DocumentBlock from the Blocks.
You usually use / for a details view outside of the TreeView, e.g. <TextBlock Text="{Binding SourceDocuments/Blocks[0].Name}"/>
I have a listbox that is bound to an observablecollection. The observable collection contains a list of objects, each with it's own observablecollection. What i want is to click an item in the first listbox and have it's list of things displayed in the second listbox. Can I do this in pure WPF?
Just bind the ItemsSource of the second listbox to the SelectedItem of the first list box.
Edit: here is some code.
public partial class MainWindow : Window
{
public MainWindow()
{
TestItems = new ObservableCollection<Test>();
InitializeComponent();
for (int i = 0; i < 5; i++)
TestItems.Add(InitTest(i));
}
public ObservableCollection<Test> TestItems { get; set; }
private Test InitTest(int index)
{
Test test = new Test();
test.Name = "Test" + index.ToString();
test.Test2Items = new ObservableCollection<Test2>();
for (int i = 0; i <= index; i++)
{
Test2 test2 = new Test2();
test2.Label = test.Name + "_label" + i.ToString();
test.Test2Items.Add(test2);
}
return test;
}
}
public class Test
{
public string Name { get; set; }
public ObservableCollection<Test2> Test2Items { get; set; }
public override string ToString()
{
return Name;
}
}
public class Test2
{
public string Label { get; set; }
public override string ToString()
{
return Label;
}
}
Xaml
<Window x:Class="WpfApplication1.MainWindow"
x:Name="MyWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="WPF Example" Height="300" Width="400">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<ListBox x:Name="ListBox1" Grid.Column="0" ItemsSource="{Binding TestItems, ElementName=MyWindow}" />
<ListBox Grid.Column="1" ItemsSource="{Binding SelectedItem.Test2Items, ElementName=ListBox1}" />
</Grid>
</Window>
Your view models could look something like this: (I am using my BindableBase here)
class MainViewModel : Bindablebase {
public ObservableCollection<ItemViewModel> Items { get; private set; }
private ItemViewModel _selectedItem;
public ItemViewModel SelectedItem {
get { return _selectedItem; }
set { SetProperty(ref _selectedItem, value, "SelectedItem"); }
}
}
class ItemViewModel : BindableBase {
public ItemViewModel (string name) {
Name = name;
Items = new ObservableCollection<string>();
}
public string Name { get; private set; }
public ObservableCollection<string> Values { get; private set; }
private string _selectedValue;
public string SelectedValue {
get { return _selectedValue; }
set { SetProperty(ref _selectedValue, value, "SelectedValue"); }
}
}
And then your view would have:
<ComboBox ItemsSource="{Binding Items}"
SelectedItem="{Binding SelectedItem}"
DisplayMemberPath="Name"/>
<!--
Note that the DataContext here could be ommitted
and the bindings would be like {Binding SelectedItem.Values}
-->
<ComboBox DataContext="{Binding SelectedItem}"
ItemsSource="{Binding Values}"
SelectedItem="{Binding SelectedValue}"/>