如何在 ListView 中创建 ComboBox + TextBox 并将输入的文本添加为 ComboBox 中的新项目

Question

我想创建一个 ListView，我需要在每个列表视图项目中创建一个 ComboBox。 ComboBox 应该是可编辑的，以便它接受文本并创建一个包含输入文本的新项目。参考我的

我取得了一些成就

这里是MainPage.xaml

的代码

<Page.Resources>
    <local:RoleConverter x:Key="RoleConverter" Options="{x:Bind VM.UserRoleList}" RoleEditText="{x:Bind VM.EditText,Mode=OneWay}"/>
</Page.Resources>

<Grid HorizontalAlignment="Center" VerticalAlignment="Center">
    <Grid.RowDefinitions>
        <RowDefinition />
        <RowDefinition />
    </Grid.RowDefinitions>
    <ListView x:Name="DataListView" ItemsSource="{x:Bind UserList}" VerticalAlignment="Center" HorizontalAlignment="Center">
        <ListView.ItemTemplate>
            <DataTemplate x:DataType="data:User">
                <StackPanel Orientation="Horizontal">
                    <TextBlock Text="{x:Bind username}" Width="150" />
                    <TextBlock Text="{x:Bind fisrt_name}"  Width="150"/>
                    <TextBlock Text="{x:Bind last_name}"  Width="150" />
                    <ComboBox 
                        Width="150"
                        IsEditable="True"
                        IsTextSearchEnabled="True"
                        Text="{Binding ElementName=DataListView, Path=DataContext.EditText, Mode=TwoWay}"
                        DisplayMemberPath="name"
                        SelectedItem="{x:Bind user_role, Mode=TwoWay , Converter={StaticResource RoleConverter}}"
                        ItemsSource="{Binding ElementName=DataListView, Path=DataContext.UserRoleList,Mode=TwoWay}">
                    </ComboBox>
                    <TextBlock Text="{x:Bind user_role.name , Mode=OneWay}"  Width="150"/>
                </StackPanel>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
    <Button Grid.Row="1" Name="submit" Click="submit_Click" Content="click" />
</Grid>

现在的问题是我已将转换器 class 属性设置为全局属性，因此当我在一个列表项中输入文本时，它也会反映在其他项中。它应该更改输入行中的文本。这是我的完整 source code

请帮忙！谢谢

Answer 1

Now the problem is I've set the converter class properties as global so when I enter text in one list item it reflect in other items as well.

问题是 Text 绑定相同的值，如果您编辑源代码，所有 ComboBoxs 文本属性也会更改。根据您的要求，您可以在 ComboBoxs class 中处理。我们需要自定义 ComboBox 并监听 TextSubmitted 事件。我已经编辑了你的项目，请参考下面的代码。

public class MyComboBox : ComboBox
{
    public MyComboBox()
    {
        this.Loaded += MyComboBox_Loaded;
    }

    private void MyComboBox_Loaded(object sender, RoutedEventArgs e)
    {
        TextSubmitted += MyComboBox_TextSubmitted;
    }

    private void MyComboBox_TextSubmitted(ComboBox sender, ComboBoxTextSubmittedEventArgs args)
    {
        var items = ItemsSource as ObservableCollection<UserRole>;
        if (items.Count > 0)
        {
            if (items.Any<UserRole>(s => s.name == args.Text))
            {
                return;
            }
            else
            {
                var newItem = new UserRole() { id = (items.Count + 1).ToString(), name = args.Text };
                items.Add(newItem);
            }

        }
    }
}

Xaml 没有转换器的代码

<Grid HorizontalAlignment="Center" VerticalAlignment="Center">
    <Grid.RowDefinitions>
        <RowDefinition />
        <RowDefinition />
    </Grid.RowDefinitions>
    <ListView
        x:Name="DataListView"
        HorizontalAlignment="Center"
        VerticalAlignment="Center"
        ItemsSource="{x:Bind UserList}"
        >
        <ListView.ItemTemplate>
            <DataTemplate x:DataType="data:User">
                <StackPanel Orientation="Horizontal">
                    <TextBlock Width="150" Text="{x:Bind username}" />
                    <TextBlock Width="150" Text="{x:Bind fisrt_name}" />
                    <TextBlock Width="150" Text="{x:Bind last_name}" />
                    <TextBlock Width="150" Text="{x:Bind user_role.name, Mode=OneWay}" />
                    <local:MyComboBox
                        Width="150"
                        DisplayMemberPath="name"
                        IsEditable="True"
                        IsTextSearchEnabled="True"
                        ItemsSource="{Binding ElementName=DataListView, Path=DataContext.UserRoleList, Mode=TwoWay}"
                        SelectedItem="{x:Bind user_role, Mode=TwoWay}"
                        />
                </StackPanel>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
    <Button
        Name="submit"
        Grid.Row="1"
        Click="submit_Click"
        Content="click"
        />
</Grid>

如何在 ListView 中创建 ComboBox + TextBox 并将输入的文本添加为 ComboBox 中的新项目

How to create ComboBox + TextBox in a ListView and add entered text as new item in ComboBox

c#

listview

combobox

viewmodel

uwp

如何在 ListView 中创建 ComboBox + TextBox 并将输入的文本添加为​​ ComboBox 中的新项目

How to create ComboBox + TextBox in a ListView and add entered text as new item in ComboBox

c#

listview

combobox

viewmodel

uwp

如何在 ListView 中创建 ComboBox + TextBox 并将输入的文本添加为 ComboBox 中的新项目