CODEWITHSUNDEEP
c#wpfxamldata-binding
user8393563
user8393563

Reputation:

Binding ObservableCollection to ComboBox in WPF App with MVVM

I am new to WPF and I tried a simple dropdown menue with a list as ItemsSource. My ComboBox unfortunately stays empty while my list should be fine.

Can you guys help me out?

My XAML:

<Window x:Class="ProjectX.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:vm="clr-namespace:ProjectX.ViewModel"
        xmlns:local="clr-namespace:ProjectX"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800"
        DataContext="{DynamicResource ViewModelMain}">
    <Window.Resources>
        <vm:ViewModelMain x:Key="ViewModelMain"/>
    </Window.Resources>
    <Grid>
        <ComboBox ItemsSource="{Binding WaageListe}" DisplayMemberPath="{Binding Waage}" />
    </Grid>
</Window>

And here is my ViewModel:

using ProjectX.Model;
using System.Collections.ObjectModel;

namespace ProjectX.ViewModel
{
    public class ViewModelMain : ViewModelBase
    {
        public ObservableCollection<Waage> waageListe;
        public ObservableCollection<Waage> WaageListe
        {
            get => waageListe;
            set
            {
                RaisePropertyChanged("WaageListe");
            }
        }

        public ViewModelMain()
        {
            WaageListe = new ObservableCollection<Waage>
            {
                new Waage {Name="Hamburg - 1"},
                new Waage {Name="Hamburg - 2"},
                new Waage {Name="Hamburg - 3"},
            };
        }
    }
}

Upvotes: 0

Views: 74

Answers (2)

mm8
mm8

Reputation: 169200

Set the DisplayMemberPath to "Name". You should also set the DataContext correctly:

<Window x:Class="ProjectX.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:vm="clr-namespace:ProjectX.ViewModel"
        xmlns:local="clr-namespace:ProjectX"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Window.DataContext>
        <vm:ViewModelMain />
    </Window.Resources>
    <Grid>
        <ComboBox ItemsSource="{Binding WaageListe}" DisplayMemberPath="Name" />
    </Grid>
</Window>

"Name" is a public property of the Waage class.

You could also define an ItemTemplate:

<ComboBox ItemsSource="{Binding WaageListe}">
    <ComboBox.ItemTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding Name}" />
        </DataTemplate>
    </ComboBox.ItemTemplate>
</ComboBox>

Waage is a type name but not a property name.

Upvotes: 1

rashmatash
rashmatash

Reputation: 1819

Use this:

<Window x:Class="ProjectX.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:vm="clr-namespace:ProjectX.ViewModel"
    xmlns:local="clr-namespace:ProjectX"
    mc:Ignorable="d"
    Title="MainWindow" Height="450" Width="800">
<Window.DataContext>
    <vm:ViewModelMain />
</Window.DataContext>
<Grid>
    <ComboBox ItemsSource="{Binding WaageListe}" DisplayMemberPath="Name"/>
</Grid>

And:

using ProjectX.Model;
using System.Collections.ObjectModel;

namespace ProjectX.ViewModel
{
  public class ViewModelMain : ViewModelBase
  {
    public ObservableCollection<Waage> WaageListe {get;} = new ObservableCollection<Waage>();

    public ViewModelMain()
    {
       WaageListe.Add(new Waage {Name="Hamburg - 1"});
       WaageListe.Add(new Waage {Name="Hamburg - 2"});
       WaageListe.Add(new Waage {Name="Hamburg - 3"});
    }
  }
}

Upvotes: 2

Related Questions