WPF - Nested Listbox Binding Not Working

Question

I am working on a project which has a nested listbox. The ItemsSource of inner-listbox referring to a collection of string defined in its parent listbox's ItemsSource. But when I run the code, I can't able to see the binded data in the nested listbox.

I searched the forum and found this and this solution but I wasn't able to resolve the problem yet. Maybe there is a problem with the code. So here is how the code looks like:

<ListBox ItemsSource="{Binding Items}" Name="detailList" Margin="5,5,0,0">

    <ListBox.ItemTemplate >
        <DataTemplate>
            <StackPanel Orientation="Vertical" Width="90" Margin="5,0,0,0">
                <TextBlock Text="{Binding Name}" Width="60" Height="30" TextWrapping="Wrap" FontSize="11" TextAlignment="Center"/>
                <Expander Visibility="{Binding Visibility}" DockPanel.Dock="Top">

                    <ListBox ItemsSource="{Binding Path=SubFamiliesNames}">
                        <ListBox.ItemTemplate>
                            <DataTemplate>
                               <StackPanel>
                                  <TextBlock Text="{Binding}"/>
                               </StackPanel>
                            </DataTemplate>
                        </ListBox.ItemTemplate>
                    </ListBox>

                </Expander>
            </StackPanel>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

Code Behind

public ObservableCollection<DirectoryItemViewModel> Items { get; set; }
public DefaultControl()
{
    InitializeComponent();
    Items = new ObservableCollection<DirectoryItemViewModel>
    {
        /*Some Initial Data*/
    };
    this.DataContext = Items;
}

DirectoryItemViewModel.cs

public class DirectoryItemViewModel : INotifyPropertyChanged 
{

    public event PropertyChangedEventHandler PropertyChanged;       
    protected void OnPropertyChanged(string propertyName)
    {
        PropertyChangedEventHandler handler = PropertyChanged;
        if (handler != null)
        {
            handler(this, new PropertyChangedEventArgs(propertyName));
        }
    }

    // Constructor
    public DirectoryItemViewModel()
    {            
        //initialize some data          

        _subfamiliesnames = new ObservableCollection<string>();
        _subfamiliesnames.Add("File1");
        _subfamiliesnames.Add("File2");
        _subfamiliesnames.Add("File3");

    }

    #region Public Properties

    public ObservableCollection<string> _subfamiliesnames;        
    public ObservableCollection<string> SubFamiliesNames
    {
        get { return _subfamiliesnames; }
        set
        {
            _subfamiliesnames = value;
            OnPropertyChanged("SubFamiliesNames");
        }
    }

    // Full path of the directory
    public string FullPath { get; set; }

    // Item type (Enum)
    public DirectoryItemType Type { get; set; }  

    public string Visibility
    {
        get
        { 
           return "Visible";               
        }
    }

    //The name of the Directory
    public string Name { get { return this.Type == DirectoryItemType.Drive ? this.FullPath : DirectoryStructure.GetFileFolderName(FullPath); } }

    #endregion

}

Please share your solutions, would really appreciate the support. Thank you.

It doesn't make a huge amount of sense to nest listboxes this way - I would look again at what the idea presentation for the UI you want to achieve is? Typically, a tree is more appropriate for hierarchical data. — Adam Brown
– Adam Brown, Commented Jan 7, 2018 at 16:40
@AdamBrown as per my use-case, I can't use a tree to represent data. Therefore, nested listbox is a way forward. But I'm struggling in data-binding. Please, can you look at this? — Ali Asad
– Ali Asad, Commented Jan 8, 2018 at 4:29

user7986086 · Accepted Answer · 2018-01-07 13:56:00Z

2

In the code behind, the data context is specified as Items. So for the ItemSource of the detailList, it will try to find the occurrence of Items, within the Items collection.

Try specifying, this.DataContext = this; in the code behind. It will then try to find 'Items' in DefaultControl class and will be successfully able to locate it.

Do let me know in case it still does not show the required data in your listview.

After modified code, the listbox shows data like following

edited Jan 7, 2018 at 13:56

answered Jan 7, 2018 at 13:12

user7986086

524 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

15ee8f99-57ff-4f92-890c-b56153 Over a year ago

DataContext = this; is considered very bad practice in controls, because it breaks all bindings from the parent.

Ali Asad Over a year ago

I tried but It didn't work either...can you suggest any other workaround, please?

user7986086 Over a year ago

Its all about finding the item which you are binding. In case your ItemSource exists in codebehind, you need to do this. For better practice, you can create another viewmodel and move Items to that viewmodel and set datacontext to newly created viewmodel. Answer is based on the code of the one who is posting it.

Ali Asad Over a year ago

interesting, your explanation has shed some light. will try the solution again. Thanks

Ali Asad Over a year ago

I've checked the screenshot, just one question, can you share the xaml with me? I'd like to know how you are handling the nested listbox binding. Thanks

|

Collectives™ on Stack Overflow

WPF - Nested Listbox Binding Not Working

1 Answer 1

7 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

7 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related