Select item in ListBox with search in WPF

0
votes

How can I select item in ListBox by inserting text to TextBox?

I have two elements in control: ListBox which contains object for searching and TextBox used for inserting text to search.

<StackPanel>
    <TextBox x:Name="textForSearchinInList"/>
    <ListBox ItemsSource="{Binding ListOfItems}" x:Name="listOfItems"
             SelectedItem="{Binding SelectedUnit, Mode=TwoWay}">
        ...
    </ListBox>
</StackPanel>

List ListOfItems contains objects of type Bar. And I want to search item by field name:

class Bar
{
     public string name;
     ...
}

User can insert a text to the TextBox and corresponding item would be selected from the ListBox.

3
c#wpfxaml

3 Answers

3
votes

The basic idea is to look for search string changes, and update selected Bar item. Binding will do the rest.

Assuming, that Bar looks like this:

public sealed class Bar
{
    public string Name { get; set; }

    // ...
}

you can create this view model class:

public class ViewModel : INotifyPropertyChanged
{
    public ViewModel()
    {
        BarItems = new[]
        {
            new Bar { Name = "Dog" },
            new Bar { Name = "Cat" },
            new Bar { Name = "Mouse" },
        };
    }

    public string SearchString
    {
        get { return searchString; }
        set
        {
            if (searchString != value)
            {
                searchString = value;
                SelectedBar = BarItems.FirstOrDefault(_ => !string.IsNullOrEmpty(_.Name) && _.Name.IndexOf(searchString, StringComparison.CurrentCultureIgnoreCase) >= 0);
                OnPropertyChanged();
            }
        }
    }
    private string searchString;

    public Bar SelectedBar
    {
        get { return selectedBar; }
        set
        {
            if (selectedBar != value)
            {
                selectedBar = value;
                OnPropertyChanged();
            }
        }
    }
    private Bar selectedBar;

    public IEnumerable<Bar> BarItems { get; }

    // INPC implementation is omitted
}

and use it this way:

<Window x:Class="WpfApplication1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:WpfApplication1">

    <Window.DataContext>
        <local:ViewModel />
    </Window.DataContext>

    <StackPanel>
        <TextBox Text="{Binding SearchString, UpdateSourceTrigger=PropertyChanged}"/>
        <ListBox ItemsSource="{Binding BarItems}" SelectedItem="{Binding SelectedBar}">
            <ListBox.ItemTemplate>
                <DataTemplate DataType="{x:Type local:Bar}">
                    <TextBlock Text="{Binding Name}"/>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
    </StackPanel>
</Window>
2
votes

By searching your list and setting your selectecUnit, to the found one:

SelectedUnit = ListOfItems.FirstOrDefault(x=>x.name == testForSearchingInList.Text);
1
votes

You can bind the selected item (directly or with synchronization)

<ListBox SelectedItem="FoundItem" IsSynchronizedWithCurrentItem="True"

to the result of the research in the ViewModel, with a c.tor 

public YourViewModel()
        {
            IList<Bar> bars = GetBars().ToList();
            _barView = CollectionViewSource.GetDefaultView(bars);
            _barView.CurrentChanged += BarSelectionChanged;

and a delegate command to find the item

 FoundItem = ListOfItems.FirstOrDefault( x => x.name // etc..