How can I not allow WPF Combobox empty

Question

I have a WPF combobox that is I bound to some stuff. Users have to select one of the items. If they don't select anything, I would like to give a warning and let the user re-select.

How can do that?

I am considering to have a "Select" button. When the user doesn't select anything, I set:

if (combobox.SelectedItem == null)
{
    MessageBox.Show("Please select one");

    //Here is the code to go back to selection
}

Is there a universal solution for this requirement?

Thanks in advance.

Answer 1

You could create a ValidationRule on the ComboBox SelectedItem, then you can have the UI show the user that they need to do something.

Example:

Validation Rule:

public class SelectionValidationRule : ValidationRule
{
    public override ValidationResult Validate(object value, System.Globalization.CultureInfo cultureInfo)
    {
        return value == null
            ? new ValidationResult(false, "Please select one")
            : new ValidationResult(true, null);
    }
}

ComboBox:

<ComboBox ItemsSource="{Binding Items}" >
    <ComboBox.SelectedItem>
        <Binding Path="SelectedItem">
            <Binding.ValidationRules>
                <local:SelectionValidationRule ValidatesOnTargetUpdated="True"/>
            </Binding.ValidationRules>
        </Binding>
    </ComboBox.SelectedItem>
</ComboBox>

This will outline the ComboBox in red

And of course ite WPF so you can customize everything, so you can add a ControlTemplate for the failed Validation and add the validation message as a ToolTip.

<Window x:Class="WpfApplication9.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:WpfApplication9"
        Title="MainWindow" Height="132" Width="278" Name="UI">

    <Window.Resources>

        <!--If there is a validation error, show in tooltip-->
        <Style TargetType="ComboBox" >
            <Style.Triggers>
                <Trigger Property="Validation.HasError" Value="true">
                    <Setter Property="ToolTip" Value="{Binding RelativeSource={RelativeSource Self}, Path=(Validation.Errors)[0].ErrorContent}"/>
                </Trigger>
            </Style.Triggers>
        </Style>

        <!--Create a template to show if validation fails-->
        <ControlTemplate x:Key="ErrorTemplate">
            <DockPanel>
                <Border BorderBrush="Red" BorderThickness="1" >
                    <AdornedElementPlaceholder/>
                </Border>
                <TextBlock Foreground="Red" FontSize="20" Text=" ! " />
            </DockPanel>
        </ControlTemplate>

    </Window.Resources>

    <Grid DataContext="{Binding ElementName=UI}">
        <ComboBox ItemsSource="{Binding Items}" Margin="21,20,22,48" Validation.ErrorTemplate="{StaticResource ErrorTemplate}">
            <ComboBox.SelectedItem>
                <Binding Path="SelectedItem">
                    <Binding.ValidationRules>
                        <local:SelectionValidationRule ValidatesOnTargetUpdated="True"/>
                    </Binding.ValidationRules>
                </Binding>
            </ComboBox.SelectedItem>
        </ComboBox>
    </Grid>
</Window>

Result:

Answer 2

You could accomplish that in multiple ways but one approach might be:

• bind your "Select" button's IsEnabled property to the SelectedItem of the combo-box using a converter that outputs True if the SelectedItem is not null and False otherwise
• and maybe also define a trigger in the combo box to display a warning when the SelectedItem is null (use same type converter to set trigger)

You might implement the type converter like this:

[ValueConversion(typeof(object), typeof(bool))]
public class NullToBoolConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        return (value != null);
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        return value;
    }
 }

Then, you could use it like this:

 <local:NullToBoolConverter x:Key="nullToBoolConverter"/>

 <Button IsEnabled="{Binding ElementName=nameOfCombobox, Path=SelectedItem, Converter={StaticResource nullToBoolConverter}}" Content="Select"/>