如何使用项目和一个文本框填充Combobox

时间:2017-03-30 18:43:58

标签: c# wpf combobox

我有两个ComboBoxes,根据第一个选择,会填充秒数。

如果在第一个选择其他时如何进行第二次ComboBox操作或显示TextBox,则用户可以输入数字/字母。

C#

 public class MyViewModel
 {        
     public ICommand UpdateCommand { get; private set; }

     private ObservableCollection<string> _Veh = new ObservableCollection<string>();

     private ObservableCollection<string> _VehTypes = new ObservableCollection<string>();
     private ObservableCollection<string> _cars = new ObservableCollection<string>();
     private ObservableCollection<string> _planes = new ObservableCollection<string>();

     public ObservableCollection<string> Veh
     {
         get { return _Veh; }
         set { SetProperty(ref _Veh, value); }
     }        

     public ObservableCollection<string> VehTypes
     {
         get { return _VehTypes; }
         set { SetProperty(ref _VehTypes, value); }
     }        

     public MyViewModel()
     {        
         UpdateCommand = new DelegateCommand<object>(OnUpdate);

         _Veh.Add("Cars");
         _Veh.Add("Planes");
         _Veh.Add("Other");

         _Cars.Add("GM");
         _Cars.Add("BMW");
         _Cars.Add("Toyota");
         _Cars.Add("Honda");

         _planes.Add("AirBus");
         _planes.Add("Boing");        
    }

    private void OnUpdate(object myobj)
    {
        _VehTypes.Clear();
        // Add new vehTypes based on _cars and _planes
    }
}

wpf

<ComboBox Name="ComboVeh" ItemsSource="{Binding Veh}" >
    <i:Interaction.Triggers>
        <i:EventTrigger EventName="SelectionChanged">
            <i:InvokeCommandAction Command="{Binding UpdateCommand}"
                                                       CommandParameter="{Binding SelectedValue, ElementName=ComboVeh}" />
        </i:EventTrigger>
    </i:Interaction.Triggers>
</ComboBox>

<ComboBox Name="ComboVehTypes" ItemsSource="{Binding VehTypes}"/>

2 个答案:

答案 0 :(得分:2)

您可以使用带有触发器的ContentControl,当{选择“其他”时,该ContentTemplate属性会将DataTemplate属性设置为包含TextBox的{​​{1}}:

<ComboBox Name="ComboVeh" ItemsSource="{Binding Veh}" >
    <i:Interaction.Triggers>
        <i:EventTrigger EventName="SelectionChanged">
            <i:InvokeCommandAction Command="{Binding UpdateCommand}"
                                           CommandParameter="{Binding SelectedValue, ElementName=ComboVeh}" />
        </i:EventTrigger>
    </i:Interaction.Triggers>
</ComboBox>

<ContentControl Content="{Binding SelectedValue, ElementName=ComboVeh}">
    <ContentControl.Style>
        <Style TargetType="ContentControl">
            <Setter Property="ContentTemplate">
                <Setter.Value>
                    <DataTemplate>
                        <ComboBox Name="ComboVehTypes" ItemsSource="{Binding DataContext.VehTypes, RelativeSource={RelativeSource AncestorType=ContentControl}}"/>
                    </DataTemplate>
                </Setter.Value>
            </Setter>
            <Style.Triggers>
                <Trigger Property="Content" Value="Other">
                    <Setter Property="ContentTemplate">
                        <Setter.Value>
                            <DataTemplate>
                                <TextBox />
                            </DataTemplate>
                        </Setter.Value>
                    </Setter>
                </Trigger>
            </Style.Triggers>
        </Style>
    </ContentControl.Style>
</ContentControl>

答案 1 :(得分:1)

您的目标可以通过以下方式实现:

  • 添加一个新的'TextBox'(这将在您的视图中处理第一个下拉菜单中选择“其他”时的文字)。

  • 将来自ViewModel的第二个下拉列表和此新TextBox的可见性属性绑定在一起,并使其可见。

就像,如果在第一个下拉列表中选择“其他”,则将“Collapsed”的第二个下拉列表的“可见性”和“TextBox”的“可见性”设置为“可见”,反之亦然。

因此,用户只能看到一个元素 - 第二个下拉列表或基于第一个下拉列表中的选择的TextBox。

您已经在处理第二个下拉列表选择,因此您只需要从ViewModel绑定新TextBox的“Text”属性,因此如果在第一个下拉列表中选择“其他”,则可以使用该文本(由用户在TextBox中输入)进一步操纵或存储在DB中。

希望,这有帮助。