UWP Combobox binding to SelectedItem property
As @Mike Eason and @kubakista said, you need set Mode
explicitly. But this won't fix your issue completely.
In your code, your SelectedComboBoxOption
is a string, but the SelectedItem
is a ComboBoxItem
object. Binding a String
to SelectedItem
won't change ComboBox
's selected item. So if you want to use SelectedComboBoxOption
to get and set ComboBox
's selected item, you need to change SelectedComboBoxOption
to ComboBoxItem
and use a Convert in {x:Bind}
to convert between Object
and ComboBoxItem
.
The Convert may like:
public class ComboBoxItemConvert : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, string language)
{
return value;
}
public object ConvertBack(object value, Type targetType, object parameter, string language)
{
return value as MainPage.ComboBoxItem;
}
}
The XAML may like:
<Page ...>
<Page.Resources>
<local:ComboBoxItemConvert x:Key="ComboBoxItemConvert" />
</Page.Resources>
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<StackPanel>
<ComboBox Name="ComboBox"
DisplayMemberPath="ComboBoxHumanReadableOption"
Header="ComboBox"
ItemsSource="{x:Bind ComboBoxOptions}"
SelectedItem="{x:Bind SelectedComboBoxOption, Mode=TwoWay, Converter={StaticResource ComboBoxItemConvert}}"
SelectedValuePath="ComboBoxOption" />
<TextBlock Name="BoundTextblock" Text="{x:Bind SelectedComboBoxOption.ComboBoxHumanReadableOption, Mode=OneWay}" />
</StackPanel>
</Grid>
</Page>
In the code-behind:
public sealed partial class MainPage : Page, INotifyPropertyChanged
{
private ObservableCollection<ComboBoxItem> ComboBoxOptions;
public MainPage()
{
this.InitializeComponent();
ComboBoxOptions = new ObservableCollection<ComboBoxItem>();
ComboBoxOptionsManager.GetComboBoxList(ComboBoxOptions);
SelectedComboBoxOption = ComboBoxOptions[0];
}
...
private ComboBoxItem _SelectedComboBoxOption;
public ComboBoxItem SelectedComboBoxOption
{
get
{
return _SelectedComboBoxOption;
}
set
{
if (_SelectedComboBoxOption != value)
{
_SelectedComboBoxOption = value;
RaisePropertyChanged("SelectedComboBoxOption");
}
}
}
...
}
If you just want to show selected item in TextBlock
, there is an easy way. We can bind TextBlock
's Text
property to ComboBox
's SelectedItem
. And please note that SelectedItem
's type is System.Object
and {x:Bind}
is strongly typed, and will resolve the type of each step in a path. If the type returned doesn’t have the member, it will fail at compile time. So we need to specify a cast to tell binding the real type of the object. But there is an issue while cast nested class in {x:Bind}
. We can put ComboBoxItem
out of MainPage
as a workaround.
namespace ComboBoxTest
{
public class ComboBoxItem
{
public string ComboBoxOption { get; set; }
public string ComboBoxHumanReadableOption { get; set; }
}
public sealed partial class MainPage : Page, INotifyPropertyChanged
{
...
}
}
And in the XAML:
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<StackPanel>
<ComboBox Name="ComboBox"
DisplayMemberPath="ComboBoxHumanReadableOption"
Header="ComboBox"
ItemsSource="{x:Bind ComboBoxOptions}"
SelectedValuePath="ComboBoxOption" />
<TextBlock Name="BoundTextblock" Text="{x:Bind ComboBox.SelectedItem.(local:ComboBoxItem.ComboBoxHumanReadableOption), Mode=OneWay}" />
</StackPanel>
</Grid>