DataGrid中的WPF組合框

Question

這是一個展示我遇到問題的行爲的示例。我有一個數據網格綁定到viewmodel中的可觀察的記錄集合。在DataGrid中，我有一個DataGridTemplateColumn，它包含一個從viewmodel中的列表填充的組合框。該數據網格還包含文本列。窗口底部有一些文本框來顯示記錄內容​​。

<Window x:Class="Customer.MainWindow" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:local="clr-namespace:Customer" 
    Title="MainWindow" Height="350" Width="525"> 

    <Window.Resources> 
     <local:SelectedRowConverter x:Key="selectedRowConverter"/> 
    </Window.Resources> 
    <Grid> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="8*"/> 
      <RowDefinition Height="3*"/> 
     </Grid.RowDefinitions> 
     <DataGrid x:Name="dgCustomers" AutoGenerateColumns="False" 
        ItemsSource="{Binding customers}" SelectedItem="{Binding SelectedRow, 
        Converter={StaticResource selectedRowConverter}, Mode=TwoWay}" 
        CanUserAddRows="True" Grid.Row="0" > 
      <DataGrid.Columns> 
       <DataGridTemplateColumn Width="Auto" Header="Country"> 
        <DataGridTemplateColumn.CellTemplate> 
         <DataTemplate> 
          <ComboBox x:Name="cmbCountry" ItemsSource="{Binding DataContext.countries, 
           RelativeSource={RelativeSource AncestorType={x:Type Window}}}" 
             DisplayMemberPath="name" SelectedValuePath="name" Margin="5" 
             SelectedItem="{Binding DataContext.SelectedCountry, 
           RelativeSource={RelativeSource AncestorType={x:Type Window}}, Mode=TwoWay, 
           UpdateSourceTrigger=PropertyChanged}" SelectionChanged="cmbCountry_SelectionChanged" /> 
         </DataTemplate> 
        </DataGridTemplateColumn.CellTemplate> 
       </DataGridTemplateColumn> 
       <DataGridTextColumn Header="Name" Binding="{Binding name}" Width="1*"/> 
       <DataGridTextColumn Header="Phone" Binding="{Binding phone}" Width="1*"/> 
      </DataGrid.Columns> 
     </DataGrid> 

     <Grid x:Name="grdDisplay" DataContext="{Binding ElementName=dgCustomers}" Grid.Row="1"> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="1*"/> 
       <ColumnDefinition Width="1*"/> 
       <ColumnDefinition Width="1*"/> 
      </Grid.ColumnDefinitions> 
      <Label Grid.Column="2" Content="Country:" VerticalAlignment="Center" HorizontalAlignment="Right"/> 
      <Label Grid.Column="4" Content="Code:" VerticalAlignment="Center" HorizontalAlignment="Right"/> 
      <BulletDecorator Grid.Column="0"> 
       <BulletDecorator.Bullet> 
        <Label Content="Name:" VerticalAlignment="Center" HorizontalAlignment="Right"/> 
       </BulletDecorator.Bullet> 
       <TextBox x:Name="txtId" Text="{Binding ElementName=dgCustomers, Path=SelectedItem.name}" Margin="5,5,5,5"/> 
      </BulletDecorator> 
      <BulletDecorator Grid.Column="1"> 
       <BulletDecorator.Bullet> 
        <Label Content="Code:" VerticalAlignment="Center" HorizontalAlignment="Right"/> 
       </BulletDecorator.Bullet> 
       <TextBox x:Name="txtCode" Text="{Binding ElementName=dgCustomers, Path=SelectedItem.countryCode}" Margin="5,5,5,5"/> 
      </BulletDecorator> 
      <BulletDecorator Grid.Column="2"> 
       <BulletDecorator.Bullet> 
        <Label Content="Phone:" VerticalAlignment="Center" HorizontalAlignment="Right"/> 
       </BulletDecorator.Bullet> 
       <TextBox x:Name="txtPhone" Text="{Binding ElementName=dgCustomers, Path=SelectedItem.phone}" Margin="5,5,5,5"/> 
      </BulletDecorator> 
     </Grid> 
    </Grid> 
</Window> 

最初沒有記錄，因此數據網格是空的，僅顯示一個包含組合框線。如果用戶首先將數據輸入到文本列中，則將記錄添加到該集合，並且可以將組合框值添加到記錄中。但是，如果用戶首先選擇組合框值，那麼當另一列被選中時，該值將消失。如果首先選擇將組合框數據添加到記錄中，如何獲取？

代碼隱藏：

public partial class MainWindow : Window 
{ 
    public GridModel gridModel { get; set; } 

    public MainWindow() 
    { 
     InitializeComponent(); 
     gridModel = new GridModel(); 
     //dgCustomers.DataContext = gridModel; 
     this.DataContext = gridModel; 
    } 

    private void cmbCountry_SelectionChanged(object sender, SelectionChangedEventArgs e) 
    { 
     ComboBox c = sender as ComboBox; 
     Debug.Print("ComboBox selection changed, index is " + c.SelectedIndex + ", selected item is " + c.SelectedItem); 
    } 
} 

備案類：

public class Record : ViewModelBase 
{ 
    private string _name; 
    public string name 
    { 
     get { return _name; } 
     set 
     { 
      _name = value; 
      OnPropertyChanged("name"); 
     } 
    } 

    private string _phone; 
    public string phone 
    { 
     get { return _phone; } 
     set 
     { 
      _phone = value; 
      OnPropertyChanged("phone"); 
     } 
    } 

    private int _countryCode; 
    public int countryCode 
    { 
     get { return _countryCode; } 
     set 
     { 
      _countryCode = value; 
      OnPropertyChanged("countryCode"); 
     } 
    } 
} 

國家類：

public class Country : ViewModelBase 
{ 
    private string _name; 
    public string name 
    { 
     get { return _name; } 
     set 
     { 
      _name = value; 
      OnPropertyChanged("name"); 
     } 
    } 

    private int _id; 
    public int id 
    { 
     get { return _id; } 
     set 
     { 
      _id = value; 
      OnPropertyChanged("id"); 
     } 
    } 

    private int _code; 
    public int code 
    { 
     get { return _code; } 
     set 
     { 
      _code = value; 
      OnPropertyChanged("code"); 
     } 
    } 

    public override string ToString() 
    { 
     return _name; 
    } 
} 

GridModel：

public class GridModel : ViewModelBase 
{ 
    public ObservableCollection<Record> customers { get; set; } 
    public List<Country> countries { get; set; } 
    public GridModel() 
    { 
     customers = new ObservableCollection<Record>(); 
     countries = new List<Country> { new Country { id = 1, name = "England", code = 44 }, new Country { id = 2, name = "Germany", code = 49 }, 
     new Country { id = 3, name = "US", code = 1}, new Country { id = 4, name = "Canada", code = 11 }}; 
    } 

    private Country _selectedCountry; 
    public Country SelectedCountry 
    { 
     get 
     { 
      return _selectedCountry; 
     } 
     set 
     { 
      _selectedCountry = value; 
      _selectedRow.countryCode = _selectedCountry.code; 
      OnPropertyChanged("SelectedRow"); 
     } 
    } 

    private Record _selectedRow; 
    public Record SelectedRow 
    { 
     get 
     { 
      return _selectedRow; 
     } 
     set 
     { 
      _selectedRow = value; 
      Debug.Print("Datagrid selection changed"); 
      OnPropertyChanged("SelectedRow"); 
     } 
    } 
} 

轉換器：

class Converters 
{ 
} 

public class SelectedRowConverter : IValueConverter 
{ 
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture) 
    { 
     return value; 
    } 

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture) 
    { 
     if (value is Record) 
      return value; 
     return new Customer.Record(); 
    } 
} 

ViewModelBase：

public class ViewModelBase : INotifyPropertyChanged 
{ 
    public ViewModelBase() 
    { 

    } 

    public event PropertyChangedEventHandler PropertyChanged; 

    public void OnPropertyChanged(string name) 
    { 
     if (PropertyChanged != null) 
     { 
      PropertyChanged(this, new PropertyChangedEventArgs(name)); 
     } 
    } 
} 

感謝您的幫助！

編輯感謝您的幫助馬克，我跑，你在下面你的答案提供的代碼，但我仍然不能在窗口底部得到的文本框中國家代碼。我得到這些錯誤：

System.Windows.Data Error: 23 : Cannot convert '{NewItemPlaceholder}' from type 'NamedObject' to type 'CustomersFreezable.RecordViewModel' for 'en-US' culture with default conversions; consider using Converter property of Binding. NotSupportedException:'System.NotSupportedException: TypeConverter cannot convert from MS.Internal.NamedObject. at System.ComponentModel.TypeConverter.GetConvertFromException(Object value) at System.ComponentModel.TypeConverter.ConvertFrom(ITypeDescriptorContext context, CultureInfo culture, Object value) at MS.Internal.Data.DefaultValueConverter.ConvertHelper(Object o, Type destinationType, DependencyObject targetElement, CultureInfo culture, Boolean isForward)'

System.Windows.Data Error: 7 : ConvertBack cannot convert value '{NewItemPlaceholder}' (type 'NamedObject'). BindingExpression:Path=SelectedRow; DataItem='GridModel' (HashCode=62992796); target element is 'DataGrid' (Name='dgCustomers'); target property is 'SelectedItem' (type 'Object') NotSupportedException:'System.NotSupportedException: TypeConverter cannot convert from MS.Internal.NamedObject. at MS.Internal.Data.DefaultValueConverter.ConvertHelper(Object o, Type destinationType, DependencyObject targetElement, CultureInfo culture, Boolean isForward) at MS.Internal.Data.ObjectTargetConverter.ConvertBack(Object o, Type type, Object parameter, CultureInfo culture) at System.Windows.Data.BindingExpression.ConvertBackHelper(IValueConverter converter, Object value, Type sourceType, Object parameter, CultureInfo culture)' Datagrid selection changed Datagrid selection changed

System.Windows.Data Error: 40 : BindingExpression path error: 'countryCode' property not found on 'object' ''RecordViewModel' (HashCode=47081572)'. BindingExpression:Path=SelectedItem.countryCode; DataItem='DataGrid' (Name='dgCustomers'); target element is 'TextBox' (Name='txtCode'); target property is 'Text' (type 'String')

System.Windows.Data Error: 23 : Cannot convert '{NewItemPlaceholder}' from type 'NamedObject' to type 'CustomersFreezable.RecordViewModel' for 'en-US' culture with default conversions; consider using Converter property of Binding. NotSupportedException:'System.NotSupportedException: TypeConverter cannot convert from MS.Internal.NamedObject. at System.ComponentModel.TypeConverter.GetConvertFromException(Object value) at System.ComponentModel.TypeConverter.ConvertFrom(ITypeDescriptorContext context, CultureInfo culture, Object value) at MS.Internal.Data.DefaultValueConverter.ConvertHelper(Object o, Type destinationType, DependencyObject targetElement, CultureInfo culture, Boolean isForward)'

System.Windows.Data Error: 7 : ConvertBack cannot convert value '{NewItemPlaceholder}' (type 'NamedObject'). BindingExpression:Path=SelectedRow; DataItem='GridModel' (HashCode=62992796); target element is 'DataGrid' (Name='dgCustomers'); target property is 'SelectedItem' (type 'Object') NotSupportedException:'System.NotSupportedException: TypeConverter cannot convert from MS.Internal.NamedObject. at MS.Internal.Data.DefaultValueConverter.ConvertHelper(Object o, Type destinationType, DependencyObject targetElement, CultureInfo culture, Boolean isForward) at MS.Internal.Data.ObjectTargetConverter.ConvertBack(Object o, Type type, Object parameter, CultureInfo culture) at System.Windows.Data.BindingExpression.ConvertBackHelper(IValueConverter converter, Object value, Type sourceType, Object parameter, CultureInfo culture)' Datagrid selection changed

System.Windows.Data Error: 40 : BindingExpression path error: 'countryCode' property not found on 'object' ''RecordViewModel' (HashCode=47081572)'. BindingExpression:Path=SelectedItem.countryCode; DataItem='DataGrid' (Name='dgCustomers'); target element is 'TextBox' (Name='txtCode'); target property is 'Text' (type 'String')

我試圖通過改變靜態資源，解決BindingExpression路徑錯誤：

<local:BindingProxy x:Key="CountryProxy" Data="{Binding}" /> 

，因此DataGrid的ItemsSource時：

ItemsSource="{Binding Source={StaticResource ResourceKey=CountryProxy}, Path=Data.countries}" DisplayMemberPath="name" 

和文本框的綁定：

<TextBox x:Name="txtCode" Text="{Binding Path=record.countryCode}" Margin="5,5,5,5"/> 

這擺脫了錯誤40，但仍然沒有看到文本框中的任何東西。你能告訴我什麼是錯的嗎？

Answer 1

請原諒我的誠實，但這段代碼有很多錯誤。

首先，MVVM存在一些嚴重的偏差。 MVVM是一個分層架構......首先是模型，然後是視圖模型頂部，然後是視圖頂部。轉換器在技術上是視圖的一部分，但如果它們位於視圖的另一側，則與視圖模型相比。

public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture) 
{ 
    if (value is Record) 
     return value; 
    return new Customer.Record(); <<<<<<<< this here 
} 

你有轉換器直接與非視圖類的工作是一個很好的跡象，您的視圖模式」不是個任何時候：你在做什麼使用轉換器來產生什麼有效的應該是你的模型新紀錄是正確地完成工作，並且它幾乎總是會導致破壞的綁定和錯誤行爲。

另一個問題是，你的Record類看起來像它的意圖是模型，即因爲它有一個國家的整數代碼，而不是對Country類實例的引用。然而，這個類是從ViewModelBase中派生出來的，並且會執行屬性更改通知。此外，類型爲Country的一個字段（即GridModel中的SelectedCountry）將被所有記錄綁定，因此將國家代碼更改爲一個可以更改它們！

要回答您的具體問題，但問題是DataGrid不會創建新記錄，直到它檢測到其中一個字段已被編輯。在這種情況下，您與SelectedRow的綁定不在記錄本身中，因此記錄沒有被創建，並且該值沒有被傳播。

這裏有一個固定的版本，堅持MVVM好一點，並修復了綁定的問題：

// record model 
public class Record 
{ 
    public string name {get; set;} 
    public string phone { get; set; } 
    public int countryCode {get; set;} 
} 

// record view model 
public class RecordViewModel : ViewModelBase 
{ 
    private Record record = new Record(); 

    public string name 
    { 
     get { return record.name; } 
     set 
     { 
      record.name = value; 
      RaisePropertyChanged("name"); 
     } 
    } 

    public string phone 
    { 
     get { return record.phone; } 
     set 
     { 
      record.phone = value; 
      RaisePropertyChanged("phone"); 
     } 
    } 

    private Country _country; 
    public Country country 
    { 
     get { return _country; } 
     set 
     { 
      _country = value; 
      record.countryCode = value.code; 
      RaisePropertyChanged("country"); 
     } 
    } 

} 

public class Country : ViewModelBase 
{ 
    private string _name; 
    public string name 
    { 
     get { return _name; } 
     set 
     { 
      _name = value; 
      RaisePropertyChanged("name"); 
     } 
    } 

    private int _id; 
    public int id 
    { 
     get { return _id; } 
     set 
     { 
      _id = value; 
      RaisePropertyChanged("id"); 
     } 
    } 

    private int _code; 
    public int code 
    { 
     get { return _code; } 
     set 
     { 
      _code = value; 
      RaisePropertyChanged("code"); 
     } 
    } 

    public override string ToString() 
    { 
     return _name; 
    } 
} 

public class GridModel : ViewModelBase 
{ 
    public ObservableCollection<RecordViewModel> customers { get; set; } 
    public List<Country> countries { get; set; } 

    public GridModel() 
    { 
     customers = new ObservableCollection<RecordViewModel>(); 
     countries = new List<Country> { new Country { id = 1, name = "England", code = 44 }, new Country { id = 2, name = "Germany", code = 49 }, 
    new Country { id = 3, name = "US", code = 1}, new Country { id = 4, name = "Canada", code = 11 }}; 
    } 

    private RecordViewModel _selectedRow; 
    public RecordViewModel SelectedRow 
    { 
     get 
     { 
      return _selectedRow; 
     } 
     set 
     { 
      _selectedRow = value; 
      Debug.Print("Datagrid selection changed"); 
      RaisePropertyChanged("SelectedRow"); 
     } 
    } 
} 

// this is needed for when you need to bind something that isn't part of the visual tree (i.e. your combobox dropdowns) 
// see http://www.thomaslevesque.com/2011/03/21/wpf-how-to-bind-to-data-when-the-datacontext-is-not-inherited/ for details 
public class BindingProxy : Freezable 
{ 
    #region Overrides of Freezable 

    protected override Freezable CreateInstanceCore() 
    { 
     return new BindingProxy(); 
    } 

    #endregion 

    public object Data 
    { 
     get { return (object)GetValue(DataProperty); } 
     set { SetValue(DataProperty, value); } 
    } 

    // Using a DependencyProperty as the backing store for Data. This enables animation, styling, binding, etc... 
    public static readonly DependencyProperty DataProperty = 
     DependencyProperty.Register("Data", typeof(object), typeof(BindingProxy), new UIPropertyMetadata(null)); 
} 

而XAML：

<Window.Resources> 
    <local:BindingProxy x:Key="CountryProxy" Data="{Binding Path=countries}" /> 
</Window.Resources> 

<Grid> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="8*"/> 
     <RowDefinition Height="3*"/> 
    </Grid.RowDefinitions> 
    <DataGrid x:Name="dgCustomers" AutoGenerateColumns="False" 
      ItemsSource="{Binding customers}" SelectedItem="{Binding SelectedRow, Mode=TwoWay}" 
      CanUserAddRows="True" Grid.Row="0" > 
     <DataGrid.Columns> 
      <DataGridComboBoxColumn Header="Country" 
       ItemsSource="{Binding Source={StaticResource ResourceKey=CountryProxy}, Path=Data}" DisplayMemberPath="name" 
       SelectedItemBinding="{Binding country, UpdateSourceTrigger=PropertyChanged}" /> 
      <DataGridTextColumn Header="Name" Binding="{Binding name, UpdateSourceTrigger=PropertyChanged}" Width="1*" /> 
      <DataGridTextColumn Header="Phone" Binding="{Binding phone, UpdateSourceTrigger=PropertyChanged}" Width="1*"/> 
     </DataGrid.Columns> 
    </DataGrid> 

    <Grid x:Name="grdDisplay" Grid.Row="1"> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="1*"/> 
      <ColumnDefinition Width="1*"/> 
      <ColumnDefinition Width="1*"/> 
     </Grid.ColumnDefinitions> 
     <Label Grid.Column="2" Content="Country:" VerticalAlignment="Center" HorizontalAlignment="Right"/> 
     <Label Grid.Column="4" Content="Code:" VerticalAlignment="Center" HorizontalAlignment="Right"/> 
     <BulletDecorator Grid.Column="0"> 
      <BulletDecorator.Bullet> 
       <Label Content="Name:" VerticalAlignment="Center" HorizontalAlignment="Right"/> 
      </BulletDecorator.Bullet> 
      <TextBox x:Name="txtId" Text="{Binding Path=SelectedRow.name}" Margin="5,5,5,5"/> 
     </BulletDecorator> 
     <BulletDecorator Grid.Column="1"> 
      <BulletDecorator.Bullet> 
       <Label Content="Code:" VerticalAlignment="Center" HorizontalAlignment="Right"/> 
      </BulletDecorator.Bullet> 
      <TextBox x:Name="txtCode" Text="{Binding Path=SelectedRow.country.code}" Margin="5,5,5,5"/> 
     </BulletDecorator> 
     <BulletDecorator Grid.Column="2"> 
      <BulletDecorator.Bullet> 
       <Label Content="Phone:" VerticalAlignment="Center" HorizontalAlignment="Right"/> 
      </BulletDecorator.Bullet> 
      <TextBox x:Name="txtPhone" Text="{Binding Path=SelectedRow.phone}" Margin="5,5,5,5"/> 
     </BulletDecorator> 
    </Grid> 
</Grid> 

忘記轉換器，你不需要它。這段代碼確實介紹的一個問題是，您現在需要點擊組合框兩次：首先選擇該行，然後再次編輯它。但網絡周圍有很多地方顯示如何解決這個問題，所以我會把它留給你。