WPF ComboBox and SelectedItem Binding to XML DataSource

Question

Hi All,

I have a comboBox inside a DataTemplate as below:-

<ComboBox x:Name="cboImages" Grid.Row="1" Grid.Column="1" SelectedItem="{Binding XPath=ImageName, Path=SelectedItem.Content, Mode=TwoWay}" IsSynchronizedWithCurrentItem="True" > <ComboBoxItem>Image1.jpg</ComboBoxItem> <ComboBoxItem>Image2.jpg</ComboBoxItem> <ComboBoxItem>Image3.jpg</ComboBoxItem> </ComboBox>

What I'm trying to achieve is to update the property (ImageName) of my XML datasource with the SelectedItem of the comboxBox.

Any clue what's wrong with the above code. Thanks in advance.

Answer 1

I suggest moving your ComboBox outside of the DataTemplate, and do your ComboBox customisation inside an ItemTemplate.

<Window x:Class="BindXML.Views.MainView"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  Title="Main Window" Height="400" Width="800">

  <Window.Resources>
    <DataTemplate x:Key="comboTemplate">
        <TextBlock Text="{Binding XPath=@ImageName}" Width="70" />
    </DataTemplate>
    <XmlDataProvider x:Key="src" XPath="/Root">
        <x:XData>
            <Root xmlns="">
                <Item ImageName="Image1.jpg" />
                <Item ImageName="Image2.jpg" />
                <Item ImageName="Image3.jpg" />
            </Root>
        </x:XData>
    </XmlDataProvider>
  </Window.Resources>
  <DockPanel>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
        </Grid.RowDefinitions>
        <ComboBox x:Name="cboImages1"
                  Grid.Row="0"
                  DataContext="{StaticResource src}"
                  ItemTemplate="{StaticResource comboTemplate}"
                  ItemsSource="{Binding XPath=Item}"                      
                  SelectedItem="{Binding XPath=ImageName, Path=SelectedItem.Content, Mode=TwoWay}" 
                  IsSynchronizedWithCurrentItem="True" >
        </ComboBox>
        <ComboBox x:Name="cboImages2"
                  Grid.Row="1"
                  DataContext="{StaticResource src}"
                  ItemTemplate="{StaticResource comboTemplate}"
                  ItemsSource="{Binding XPath=Item}"                      
                  SelectedItem="{Binding XPath=ImageName, Path=SelectedItem.Content, Mode=TwoWay}" 
                  IsSynchronizedWithCurrentItem="True"  >
        </ComboBox>
        <Button Grid.Row="2" Click="Button_Click" />
    </Grid>
  </DockPanel>
</Window>

The following test code-behind shows different ComboxBox selected items:

  private void Button_Click(object sender, RoutedEventArgs e)
  {
     XmlElement e1 = cboImages1.SelectedItem as XmlElement;
     if ( e1 != null )
     {
        XmlAttribute result1 = e1.Attributes["ImageName"] as XmlAttribute;
        if ( result1 != null )
        {
           string name1 = result1.Value;
        }
     }

     XmlElement e2 = cboImages2.SelectedItem as XmlElement;
     if ( e2 != null )
     {
        XmlAttribute result2 = e2.Attributes["ImageName"] as XmlAttribute;
        if (result2 != null)
        {
           string name2 = result2.Value;
        }
     }
  }