klaydze
klaydze

Reputation: 981

WPF ComboBox SelectedItem from Autocomplete

I'm implementing an autocomplete in a ComboBox as below. The autocomplete is working just fine. The only problem I'm facing is, I would like my SelectedItems be displayed as ItemNumber[space]ItemDescription. Currently, it only display the ItemNumber when I select it from the autocomplete. Can you guys revamped the existing code below.

enter image description here

class ItemDetails
{
    string _itemNumber;
    string _itemDescription;

    public string ItemNumber
    {
        get { return _itemNumber; }
        set { _itemNumber = value; }
    }
    public string ItemDescription
    {
        get { return _itemDescription; }
        set { _itemDescription = value; }
    }

    public ItemDetails() { }
    public ItemDetails(string itemNo, string description)
    {
        _itemNumber = itemNo;
        _itemDescription = description;
    }
}

Populate Material

    private void InitMaterial()
    {
        List<ItemDetails> items = new List<ItemDetails>();

        for (int i = 0; i <= 1000; i++)
        {
            items.Add(new ItemDetails(i.ToString(), "Item " + i.ToString()));
        }

        cbo1.ItemsSource = items;
    }

XAML

<ComboBox x:Name="cboItemNoLegacy" HorizontalContentAlignment="Stretch"
      TextSearch.TextPath="MaterialNumberLegacy"
      ItemsSource="{Binding}" 
      IsSynchronizedWithCurrentItem="True"
      IsEditable="True"
      SelectedItem="{Binding LegacyItemNumber, UpdateSourceTrigger=PropertyChanged, ValidatesOnDataErrors=True, Mode=TwoWay, Converter={StaticResource MaterialMasterConverter}}" 
      SelectionChanged="cboItemNoLegacy_SelectionChanged">
<ComboBox.ItemContainerStyle>
    <Style>
        <Setter Property="Control.Padding" Value="0"></Setter>
        <Style.Triggers>
            <Trigger Property="ComboBoxItem.IsSelected" Value="True">
                <Setter Property="ComboBoxItem.Background" Value="SkyBlue" />
            </Trigger>
        </Style.Triggers>
    </Style>
</ComboBox.ItemContainerStyle>
<ComboBox.ItemTemplate>
    <DataTemplate>
        <Grid Margin="0">
            <Border Margin="5" BorderThickness="0" BorderBrush="SteelBlue"
               CornerRadius="1">
                <Grid HorizontalAlignment="Left">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition />
                        <ColumnDefinition />
                    </Grid.ColumnDefinitions>

                    <TextBlock x:Name="tbSiteCode" FontWeight="Normal" Text="{Binding Path=ItemNumber}" Margin="0,0,7,0"></TextBlock>
                    <TextBlock Grid.Column="1" x:Name="tbSiteDesc" FontWeight="Normal" Text="{Binding Path=ItemDescription}" Margin="0,0,7,0"></TextBlock>
                </Grid>
            </Border>
        </Grid>
    </DataTemplate>
</ComboBox.ItemTemplate>

Upvotes: 2

Views: 2150

Answers (1)

Novitchi S
Novitchi S

Reputation: 3741

When you set the IsEditable=True property on a ComboBox the selected item in the selection area will not be rendered used item's DataTemplate. In this case you will have a TextBox control. This TextBox control can display only a String.

So what you have to do is to provide a property for that TextBox with the desired formatted string you want to be displayed in the selection area. You have the TextSearch.TextPath property to specify what property in your Item object should be considered as the value for the TextBox and the TextSearch functionality.

Add a property to you ItemDetails class with the aggregated string value:

public string AggregatedDescription
{
    get { return String.Format("{0} {1}", ItemNumber, ItemDescription);}
}

Set this property to the ComboBox element TextSearch.TextPath="AggregatedDescription"

Another solution (i prefer this one) will be to just override the ItemDetails .ToString() method to get the desired formatted value:

public override string ToString()
{
    return String.Format("{0} {1}", ItemNumber, ItemDescription);
}

In this case, you should not specify the TextSearch.TextPath property. When it's not set, the .ToString() value of the current selected item will be used as the string for the TextSearch functionality.

Upvotes: 3

Related Questions