locked
ListBox and value issue

    Question

  • Hi,

    I have the below listbox in my store app which I am populating using the below code.  I now need to add a value for each text option (like with a dropdownbox) but can not get it working i.e. I want the text option visible to the user but the value option hidden.

            listBox.Items.Add("Rates")
            listBox.Items.Add("Rents")
            listBox.Items.Add("Water")

    I have tried creating a simple class (testClass1) and then making a List from it and making it the itemsource of the listbox but this didn't work.

            Dim temp As New List(Of testClass1)()
            temp.Add(New testClass1() With {.Key = "Rates", .Value = "1"})
            temp.Add(New testClass1() With {.Key = "Rent", .Value = "2"})
            listBox.ItemsSource = temp

    Is there something I am missing here?

    Thanks

                                                     <ListBox BorderThickness="0"  >
                                                                <ListBox.ItemTemplate>
                                                                    <DataTemplate>
                                                                        <TextBlock Text="{Binding Key}"  />
                                                                    </DataTemplate>
                                                                </ListBox.ItemTemplate>
                                                            </ListBox>

    Tuesday, August 12, 2014 3:15 PM

Answers

  • "<project name> + <page name>"...? The following code should work:

    testClass1.vb

    Public Class testClass1
        Public Property Key As String
        Public Property Value As String
    End Class


    MainPage.xaml.vb

    Public NotInheritable Class MainPage
        Inherits Page
    
        Public Sub New()
    
            ' This call is required by the designer.
            InitializeComponent()
    
            ' Add any initialization after the InitializeComponent() call.
            Dim temp As New List(Of testClass1)()
            temp.Add(New testClass1() With {.Key = "Rates", .Value = "1"})
            temp.Add(New testClass1() With {.Key = "Rent", .Value = "2"})
            listBox.ItemsSource = temp
    
        End Sub
    
        ''' <summary>
        ''' Invoked when this page is about to be displayed in a Frame.
        ''' </summary>
        ''' <param name="e">Event data that describes how this page was reached.  The Parameter
        ''' property is typically used to configure the page.</param>
        Protected Overrides Sub OnNavigatedTo(e As Navigation.NavigationEventArgs)
        
        End Sub
    
    End Class
    


    MainPage.xaml

    <Page
        x:Class="App4Vb.MainPage"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="using:App4Vb"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        mc:Ignorable="d">
    
        <Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
            <ListBox x:Name="listBox" BorderThickness="0"  >
                <ListBox.ItemTemplate>
                    <DataTemplate>
                        <TextBlock Text="{Binding Key}"  />
                    </DataTemplate>
                </ListBox.ItemTemplate>
            </ListBox>
        </Grid>
    </Page>
    

    The values of the Key property of each testClass1 item should be visible in the ListBox.

    • Marked as answer by Ireland75 Wednesday, August 13, 2014 2:52 PM
    Wednesday, August 13, 2014 1:19 PM

All replies

  • In your ListBox you have not given the name for it to access it through the code.

    <ListBox x:name="listBox" BorderThickness="0"  >
                                                                 <ListBox.ItemTemplate>
                                                                     <DataTemplate>
                                                                         <TextBlock Text="{Binding Key}"  />
                                                                     </DataTemplate>
                                                                 </ListBox.ItemTemplate>
                                                             </ListBox>

    For more you could refer this one too:

    http://stackoverflow.com/questions/449410/programmatically-binding-list-to-listbox


    Hope it helps!

    Tuesday, August 12, 2014 4:25 PM
  • Hi,

    Thanks for that...I had the x:Name in the code (had removed it for testing). So the listbox works fine when I call the below simple 'add' in the page load -
    listBox.Items.Add("Rates")

    However when I use the testClass1 above, it does not work...instead it shows the text '<project name> + <page name>' for each item.  I think its the binding that's the problem.  I am trying to bind it to the field called 'Key' in the class.

    I looked at your example link and there is an one close enough (see code below from link) but I can not get it to work.  On my DataTemplate there is no DataType option.

    Thanks for your help.

    <DataTemplate DataType="{x:Type l:Person}">
            <StackPanel Orientation="Horizontal">
                <TextBlock Text="{Binding FirstName}"/>
                <TextBlock Text=" "/>
                <TextBlock Text="{Binding Surname}"/>
            </StackPanel>
        </DataTemplate> 


    • Edited by Ireland75 Wednesday, August 13, 2014 10:11 AM
    Wednesday, August 13, 2014 10:10 AM
  • "<project name> + <page name>"...? The following code should work:

    testClass1.vb

    Public Class testClass1
        Public Property Key As String
        Public Property Value As String
    End Class


    MainPage.xaml.vb

    Public NotInheritable Class MainPage
        Inherits Page
    
        Public Sub New()
    
            ' This call is required by the designer.
            InitializeComponent()
    
            ' Add any initialization after the InitializeComponent() call.
            Dim temp As New List(Of testClass1)()
            temp.Add(New testClass1() With {.Key = "Rates", .Value = "1"})
            temp.Add(New testClass1() With {.Key = "Rent", .Value = "2"})
            listBox.ItemsSource = temp
    
        End Sub
    
        ''' <summary>
        ''' Invoked when this page is about to be displayed in a Frame.
        ''' </summary>
        ''' <param name="e">Event data that describes how this page was reached.  The Parameter
        ''' property is typically used to configure the page.</param>
        Protected Overrides Sub OnNavigatedTo(e As Navigation.NavigationEventArgs)
        
        End Sub
    
    End Class
    


    MainPage.xaml

    <Page
        x:Class="App4Vb.MainPage"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="using:App4Vb"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        mc:Ignorable="d">
    
        <Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
            <ListBox x:Name="listBox" BorderThickness="0"  >
                <ListBox.ItemTemplate>
                    <DataTemplate>
                        <TextBlock Text="{Binding Key}"  />
                    </DataTemplate>
                </ListBox.ItemTemplate>
            </ListBox>
        </Grid>
    </Page>
    

    The values of the Key property of each testClass1 item should be visible in the ListBox.

    • Marked as answer by Ireland75 Wednesday, August 13, 2014 2:52 PM
    Wednesday, August 13, 2014 1:19 PM
  • Hi Magnus,

    Thanks for that.  I recreated it from scratch and your example worked.  I don't know how many times I tried to get this working but obviously I messed up something trying different things and didn't go back to the original.  A lesson there!

    Thanks

    Wednesday, August 13, 2014 2:52 PM