如何使用 Datagrid 和 ComboBox 在 WPF 中创建过滤器

Question

所以这里我有一个 MVVM 表单。 表单包含一个连接到数据库的数据网格。 我还有一个 ComboBox，我想将其用作过滤器选项。 过滤器选项应按“AnlV nr”过滤，因此当用户从 ComboBox 中选择“01”时，数据网格应刷新并仅显示具有“01”的“AnlV nr”下面我将与您分享代码，您可以看到我已经在 ComboBox 中显示了“AnlV”值，但我现在不知道如何执行 rest 并使过滤器工作。 下面是我的 Viewmodel 和 Xaml 代码。

如果有人能帮我解决这个问题，我会非常感激。

Xaml 代码：

<Window x:Class="QBondsFrontend.Views.Input.AnlVTexteView"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:QBondsFrontend.Views.Input" xmlns:input="clr-namespace:QBondsFrontend.ViewModels.Input" d:DataContext="{d:DesignInstance Type=input:AnlVTexteViewModel}"
        mc:Ignorable="d"
        Title="AnlVTexteView" 
        Width="800"
        MinHeight="400"
        Height="490"
        MinWidth="1010"
        MaxWidth="1010"
        UseLayoutRounding="True">
    <Grid Background="#A8A8A8" >
        

        <StackPanel VerticalAlignment="Top" Background="#A8A8A8" Orientation="Horizontal" Height="57">
            <Label  
                   Content="AnlV Nr.:" Height="35" FontSize="12"/>

            <ComboBox  Background="LightGray" Height="20" Width="70" ItemsSource="{Binding lstAnlVTexte}" SelectedItem="{Binding Search}">
                <ComboBox.ItemTemplate>
                    <DataTemplate>
                        <TextBlock Text="{Binding AnlVPara}"/>
                    </DataTemplate>
                </ComboBox.ItemTemplate>

            </ComboBox>


                <Button  Height="18" Width="68" Margin="5, 0"
                    Content="Filter löschen" FontSize="11" Style="{StaticResource STL_ButtonStandard}"
                    x:Name="filterlöschen"  
                     Command="{Binding icdFilterDelete}"/>

            
                    
            
            
        </StackPanel>

        
        

       
        <StackPanel Background="LightGray" VerticalAlignment="Top" Height="177"  Margin="0,57,0,0">


            <DataGrid x:Name="datagridXAML" 
                      Height="177" 
                      ItemsSource="{Binding lstAnlVTexte, Mode=TwoWay}" 
                      Style="{StaticResource STL_DataGridReporting}"
                      CellStyle="{StaticResource STL_DataGridCellReporting}"
                      ColumnHeaderStyle="{StaticResource STL_DataGridColumnHeaderReporting}"
                      AlternatingRowBackground="#A8A8A8"
                      CanUserResizeColumns="False"
                      >
                      

                <DataGrid.Columns>
                   
                    <DataGridTextColumn Header="AnlV-Nr" 
                                        Binding="{Binding AnlVPara}" 
                                        Width="60"/>
                    
                    
                    <DataGridTextColumn Header="gültig ab" 
                                        Binding="{Binding TextGueltigAb}"
                                        Width="68"/>
                    
                    <DataGridTextColumn Header="Text" 
                                        Binding="{Binding ParaText}" 
                                        Width="750"/>
                    
                    <DataGridTextColumn Header="Info" 
                                        Binding="{Binding Info}" 
                                        Width="*"/>

                </DataGrid.Columns>

            </DataGrid>

        </StackPanel>

        
        
        
        <StackPanel Background="#A8A8A8" HorizontalAlignment="Center" Margin="10,268,0,141" Width="1010" >
            
            <Label Content="Bearbeitungsbereich" FontWeight="Bold" FontSize="12" Height="33" />
        
        </StackPanel>




        <StackPanel>
           
            
            <StackPanel Orientation="Horizontal" Background="#A8A8A8" HorizontalAlignment="Center" 
                        Width="1010" Margin="0,294,0,0" Height="31">
                
                <Label Height="25" Width="60" Margin="20, 0, 0, 0" Content="AnlV-Nr.:"  />

                <ComboBox IsEditable="True" Background="gray" Height="22" Width="69" ItemsSource="{Binding AnlVPara}">
                    <ComboBox.ItemTemplate>
                        <DataTemplate>
                            <TextBlock Text="{Binding lstAnlVTexte}"/>
                        </DataTemplate>
                    </ComboBox.ItemTemplate>
                </ComboBox>



                    <CheckBox Height="15" Margin="10, 0, 0, 0"  />
                
                <Label  Height="26" Width="122" Content="Editierwarnungen"  />
                                
                <StackPanel Height="48" Width="100"/>
                        
            </StackPanel>
            
            
            
            
            <StackPanel Height="22" Orientation="Horizontal">
                
                <Label Margin="20, 0, 0, 0" Content="gültig ab:" Height="27"  />
                
                <TextBox Background="LightGray" Height="20" Width="100" />
            
            </StackPanel>

            
            
            
            <StackPanel Height="50" Orientation="Horizontal">
                
                <Label  Content="Text:" Height="27" Width="38" Margin="42,0,0,10"  />
                
                <TextBox Background="LightGray" Width="500" Height="43" />
            
            </StackPanel>
            
            
            
            
            <StackPanel Orientation="Horizontal" >
                
                <Label Content="Info:" Height="27" Width="38" Margin="42,0,0,0" />
                
                <TextBox Background="LightGray" Width="500" Height="20" />
                
                <Button x:Name="BTN_speichern" Width="80" Height="18" Margin="20,0,0,0" Content="Speichern" 
                        Style="{StaticResource STL_ButtonStandard}" Command="{Binding icdSpeichern}"/>
            
            </StackPanel>
            
        
            
            
        </StackPanel>
    </Grid>
</Window>

视图模型：

using Newtonsoft.Json;
using QBondsData.DBModels;
using System;
using System.Collections.Generic;
using System.Net.Http;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Input;
using System.Linq;

namespace QBondsFrontend.ViewModels.Input
{
    public class AnlVTexteViewModel : BaseViewModel
    {

        #region data

        private string _AnlVPara;
        private DateTime _TextGueltigAb;
        private string _ParaText;
        private string _Info;      
        private List<AnlVhistText> _lstAnlVTexte;
        private string _search;
        
        #endregion
        #region constructor
        public AnlVTexteViewModel()
        {
            icdFilterDelete = new RelayCommand<object>(parameter => filterdelete(), parameter => true);


            icdSpeichern = new RelayCommand<object>(parameter => speichern(), parameter => true);

        
           GetData();
        }




        #endregion
        #region members

        

        public ICommand icdFilterDelete { get; set; }
                     

        public ICommand icdSpeichern { get; set; }




        private string Search
        {
            get { return _search; }
            set
            {
                _search = value;
                OnPropertyChanged("Search");
            }
        }

        




        public string AnlVPara
        {
            get
            {
                return _AnlVPara;
            }
            set
            {
                _AnlVPara = value;
                OnPropertyChanged("AnlVPara");
            } 
        }

        public DateTime TextGueltigAb
        {
            get
            {
                return _TextGueltigAb;
            }
            set
            {
                _TextGueltigAb = value;
                OnPropertyChanged("TextGueltigAb");
            }
        }

        public string ParaText
        {
            get
            {
                return _ParaText;
            }
            set
            {
                _ParaText = value;
                OnPropertyChanged("ParaText");

                
            }
        }

        public string Info
        {
            get
            {
                return _Info;
            }
            set
            {
                _Info = value;
                OnPropertyChanged("Info");
            }
        }

        public List<AnlVhistText> lstAnlVTexte
        {
            get { return _lstAnlVTexte; }
            set
            {
                
                _lstAnlVTexte = value;
                OnPropertyChanged("lstAnlVTexte");
            }
        }



        #endregion
        #region methods

        private void filterdelete()
        {
            
        }

          
        private void speichern()
        {
             
        }
        private async Task GetData()
        {
            HttpResponseMessage Response = await Globals.SendRequest("AnlVTexte/GetAnlVTexte"
                                                                 , "GET");
            if (Response.IsSuccessStatusCode)
            {
                lstAnlVTexte = JsonConvert.DeserializeObject<List<AnlVhistText>>
                        (await Response.Content.ReadAsStringAsync());
                    
            }
            else
            {
                lstAnlVTexte = new List<AnlVhistText>();

                Application.Current.Dispatcher.Invoke((Action)delegate
                {
                    Globals.CloseReportByHash(this.GetHashCode()
                                            , "Fehler! (HTTP Status " + Response.StatusCode + ")." +
                                              "Kontaktieren Sie den Support.");
                    
                
                });
            }
        
        }
        #endregion




    }


}

Answer 1

当您将lstAnlVTexte的类型更改为ICollectionView时，您会得到两个事件CurrentChanged和CurrentChanging ，您可以在视图模型中处理它们。 从ICollectionView您可以获得CurrentItem 。

像这样：

private List<AnlVhistText> _anlVTexte = new List<AnlVhistText>();


public AnlVTexteViewModel()
{
    [...]
    lstAnlVTexte = new CollectionView(_anlVTexte);
    lstAnlVTexte.CurrentChanged += SelectionChanged;  // raised after the current item has been changed.
    lstAnlVTexte.CurrentChanging += SelectionChanging;  // raise before changing the current item. Event handler can cancel this event.
}

private void SelectionChanged(object sender, EventArgs e)
{
var selectedItem = lstAnlVTexte.CurrentItem;
}

private void SelectionChanging(object sender, CurrentChangingEventArgs e)
{

}


private ICollectionView _lstAnlVTexte;

public ICollectionView lstAnlVTexte
{
    get { return _lstAnlVTexte; }
    set
    {
        
        _lstAnlVTexte = value;
        OnPropertyChanged("lstAnlVTexte");
    }
}

Answer 2

下面是使用社区工具包 mvvm 和 linq 的示例。

如果您不熟悉，该工具包会生成代码。

这是一个简单的场景来说明该方法。

主窗口视图模型。

public partial class MainWindowViewModel : ObservableObject
{
    [ObservableProperty]
    private int selectedFilterInt = -1;

    partial void OnSelectedFilterIntChanged(int newValue)
    {
        FilteredList = new ObservableCollection<MyItem>(FullList.Where(x=>x.Category == selectedFilterInt).ToList());
    }

    public List<int> FilterOptions { get; set; } = new List<int> {1,2,3};

    private List<MyItem> FullList= new List<MyItem>           
        {    
             new MyItem{ Category = 1},
             new MyItem{ Category = 1},
             new MyItem { Category = 1 },
             new MyItem { Category = 2 },
             new MyItem { Category = 2 },
             new MyItem { Category = 3 }
        };


    [ObservableProperty]
    private ObservableCollection<MyItem> filteredList = new ObservableCollection<MyItem>();

    public MainWindowViewModel()
    {
        FilteredList = new ObservableCollection<MyItem>(FullList);
    }
}

有所有项目的完整列表。

但是过滤列表将绑定到我的列表框的项目源（相当于您的数据网格）。

由于生成的代码，当 selectedFilterInt 更改时，将调用 OnSelectedFilterIntChanged。 如果您深入研究生成的代码，它有一个处理程序监听 SelectedFilterInt 的属性更改。

该方法使用 linq 将完整列表过滤到过滤列表中。

设置过滤列表属性引发属性更改，视图重新读取新集合。

主窗口。 （我确实提到这是简化的）

<Window.DataContext>
    <local:MainWindowViewModel/>
</Window.DataContext>
<Grid>
    <StackPanel>
        <ComboBox SelectedItem="{Binding SelectedFilterInt}"
                  ItemsSource="{Binding FilterOptions}"/>
        <ListBox ItemsSource="{Binding FilteredList}">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <StackPanel>
                        <TextBlock Text="{Binding Category}"/>
                        <TextBlock Text="{Binding Comment}"/>
                    </StackPanel>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
    </StackPanel>
</Grid>
</Window>

和我的项目

public partial class MyItem : ObservableObject
{
    [ObservableProperty]
    private int category = 0;

    [ObservableProperty]
    private string comment = "Some test string";
}

这在视觉上有点平庸但有效：

在您的代码中，您需要将所有数据放入一个集合中。

调用那个 FulList。

然后您需要另一个集合，这将是过滤后的数据。

调用此 FilteredList。

将 itemssource 绑定到 FilteredList

最初，您可能希望 FilteredList 为 = FullList

然后，当用户在 combobox 中选择某些内容时，您需要对此做出反应。

您可以将 selecteditem 绑定到属性并在 setter 中执行操作或像我的代码一样处理 propertychanged。

不管你怎么做，你都会得到一个新的 integer。

然后您使用它来将 FullList 过滤到一个新的集合中，该集合将替换绑定的 FilteredList。

您还需要以某种方式为每个 AnlV nr 输入一个条目，无论您的 combobox 中是什么。

AnlV nr 不能用作属性名称，因为它有一个空格，但它等同于我示例中的类别。

您将在 linq 中使用该选定值。

将该属性的名称替换为类别。 替换您收藏的类型。 也许那是 AnlVhistText。 我不知道。