XAML ListBox to TextBox Update code

Jesse Glover Published at Dev

Jesse Glover

I know i've asked variants of this question before, but after quite a few hours of testing and researching. I've managed to get my XAML code to 50% of how I want it to work, and I need help with the rest. I've got my xaml code to load an XML file into a Listbox, and bound my textbox to the listbox. However, The textbox's text will not update when I select another value in the ListBox.

<Window x:Class="BeginnersJapanese.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="274" Width="525">
    <Window.Resources>
        <XmlDataProvider x:Key="XmlData"
                   Source="https://www.dropbox.com/s/jgw84kqj2k1bwq1/JapaneseEnglishData.xml?dl=1"
                   XPath="WordList/Word"/>
    </Window.Resources>
    <Grid Margin="0,0,0,1">
        <Grid.DataContext>
            <XmlDataProvider x:Name="XmlData" Source="https://www.dropbox.com/s/jgw84kqj2k1bwq1/JapaneseEnglishData.xml?dl=1" XPath="WordList/Word"/>
        </Grid.DataContext>
        <Grid.RowDefinitions>
            <RowDefinition Height="auto"/>
            <RowDefinition/>
        </Grid.RowDefinitions>
        <Button Content="Speak" Name="speakBtn" HorizontalAlignment="Left" Margin="252,158,0,0" Grid.Row="1" VerticalAlignment="Top" Width="121" Click="speakButton_Click"/>
        <ListBox Name="listBx" HorizontalAlignment="Left" ItemsSource="{Binding XPath=/WordList/Word/English}" Height="225" Margin="10,10,0,0" Grid.Row="1" VerticalAlignment="Top" Width="152" IsSynchronizedWithCurrentItem="True"/>
        <TextBox Name="txtBox" HorizontalAlignment="Left" Height="23" Margin="167,110,0,0" Grid.Row="1" TextWrapping="Wrap" DataContext="{Binding ElementName=listBx, Path=SelectedItem.InnerText}" Text="{Binding XPath=Kanji}" VerticalAlignment="Top" Width="340" IsReadOnly="True"/>
    </Grid>
</Window>

Essentially, What I am trying to do is select an item in the listbox and it display the Japanese equivalent from my xml file. Which looks like:

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<!--This is a generated XML File-->
<WordList>
  <Word>
    <English>Me</English>
    <Romaji>boku</Romaji>
    <Kanji>ぼく</Kanji>
  </Word>
  <Word>
    <English>I</English>
    <Romaji>boku</Romaji>
    <Kanji>ぼく</Kanji>
  </Word>
  <Word>
    <English>Me</English>
    <Romaji>watashi</Romaji>
    <Kanji>わたし</Kanji>
  </Word>
</WordList>

The current issue is the textbox will only display boku(ぼく) and will not change to watashi(わたし) when I change the Listbox to the other Me word in the list.

har07

One possible way to make it work without changing much of your current code, modify the TextBox's DataContext and Text properties binding as follow :

<ListBox ItemsSource="{Binding XPath=/WordList/Word/English}" .... />
<TextBox DataContext="{Binding ElementName=listBx, Path=SelectedItem}" 
         Text="{Binding XPath=../Kanji}" ..... />

Some brief explanations :

XPath only worked for XmlDocument/XmlElement DataContext, and InnerText is not. That's why I change the TextBox's DataContext binding to point to the ListBox's SelectedItem (SelectedItem contains an XmlElement representing <English> node).

Then I need to also change the Xpath for TextBox's Text property. Since SelectedItem points to <English> node, you need to climb up one level to get to <Word> element using XPath .., and from there get down one level to <Kanji> element using XPath /Kanji.

Another possible XPath to get to <Kanji> node starting form <English> node is by using following-sibling axes :

Text="{Binding XPath=following-sibling::Kanji}"

Result :

enter image description here

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at2021-02-18

Comments

0 comments

From Dev

Related Related

Article

XAML ListBox to TextBox Update code

XAML ListBox to TextBox Update code

Check if listbox contains textbox

WPF ListBox Binding Update

Styling TextBox/PasswordBox in XAML

how to use the listbox value to update textbox

Windows Phone Listbox Selection to Textbox

C# XAML Listbox collapse when clicked

Text in a TextBox does not update instantly when change it in the code-behind

Top Alignment inside WPF ListBox WPF XAML

Listbox does not show items c# xaml

XAML Controltemplate on Textbox, Datatrigger on textbox

How to add a Scrollbar in Listbox in a Grid in XAML?

ListBox Item layout in XAML/WPF

How to apply CueBanner for a TextBox in xaml

conversion of xaml textbox code to c# textbox code?

Bind ListBox to SelectionChanged ComboBox in XAML

Check if listbox contains textbox

WPF ListBox Binding Update

Converting HTML Code in TextBox to display Correctly (after input through a keyboard made in XAML)

Why doesn't TextBox bind to Label in my XAML code?

Overshadow Grid with textbox WPF XAML

Listbox Sorting based on TextBox value

Textbox in listbox not updating when lostfocus

c# filter listbox with textbox

how to update my textbox total price which is in listbox

Filtering listbox using textbox, while the listbox is filled using File Names

Replacing text in a textbox, and then adding it to listbox

XAML extend ListBox and ListBoxItem control

How to Update a Listbox from another Listbox

XAML - Style for label and textbox