簡體   English   中英

Datagrid組合框數據綁定更新MVVM

[英]Datagrid combobox databinding updating MVVM

我在理解如何使用嵌入在數據網格中的組合框時遇到問題。 例如,我有一個綁定到類GridModel的數據網格:

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

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

GridModel類為:

public class GridModel : ViewModelBase
{
    public ObservableCollection<Record> customers { get; set; }
    public List<Country> countries { get; set; }
    public GridModel()
    {
        customers = new ObservableCollection<Record>();
        customers.Add(new Record { name = "Alan", phone = "123" });
        customers.Add(new Record { name = "Bert", phone = "234" });
        countries = new List<Country> { new Country { id = 1, name = "England", code = 44 }, new Country { id = 2, name = "Germany", code = 49 } };
    }
}

XAML是:

<Window x:Class="Customer.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
<Grid>
    <DataGrid x:Name="dgCustomers" AutoGenerateColumns="False" ItemsSource="{Binding customers}">
        <DataGrid.Resources>
            <DataTemplate x:Key="dgCombobox">
                <ComboBox   x:Name="cmbCountry"
                            ItemsSource="{Binding countries}"
                            DisplayMemberPath="{Binding name}"
                            SelectedValue="{Binding customers.countryCode, RelativeSource={RelativeSource FindAncestor, AncestorType=Window}, UpdateSourceTrigger=PropertyChanged, Mode=TwoWay}"
                            SelectedValuePath="{Binding code}">
                </ComboBox>
            </DataTemplate>
        </DataGrid.Resources>
        <DataGrid.Columns>
            <DataGridTextColumn Header="Name" Binding="{Binding name}"/>
            <DataGridTemplateColumn Header="Country" CellTemplate="{StaticResource dgCombobox}" />
            <DataGridTextColumn Header="Phone" Binding="{Binding phone}" ></DataGridTextColumn>
        </DataGrid.Columns>
    </DataGrid>

</Grid>

第二列中的組合框應該由模型的countrys屬性填充,該屬性是Country類的列表:

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");
        }
    }
}

組合框應顯示國家名稱。 從類記錄的客戶ObservableCollection填充數據網格:

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");
        }
    }
}

為了完整起見,這是ViewModelBase類:

public class ViewModelBase : INotifyPropertyChanged
{
    public ViewModelBase()
    {

    }

    public event PropertyChangedEventHandler PropertyChanged;

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

我想要的是用戶能夠從每行的組合框中為客戶選擇一個國家/地區,然后該行的記錄將其countryCode屬性設置為所選國家/地區的code屬性。 我使用了datagridtemplatecolumn,以便組合框顯示在網格上。 任何幫助表示贊賞,我已經為此努力了一個多月,並且開始感到非常愚蠢。

第二列中的組合框應該由模型的countrys屬性填充,

我為此重新安排了您的datagrid xaml

     <Grid>
        <DataGrid ItemsSource="{Binding customers}" 
      AutoGenerateColumns="False" SelectedItem="{Binding SelectedRow,Mode=TwoWay}"
      CanUserAddRows="False" Grid.Row="1">
            <DataGrid.Columns>
                <DataGridTextColumn Binding="{Binding name}" Header="Name"
                                Width="*"/>

                <DataGridTemplateColumn Width="Auto" Header="Country">
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <ComboBox 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}"/>
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                </DataGridTemplateColumn>

                <DataGridTextColumn Binding="{Binding phone}" Header="Phone"
                                Width="*"/>
            </DataGrid.Columns>
        </DataGrid>
    </Grid>

我想要的是用戶能夠從每行的組合框中為客戶選擇一個國家/地區,然后該行的記錄將其countryCode屬性設置為所選國家/地區的code屬性。

在您的視圖模型中,刪除dgCustomers.DataContext = gridModel; 在MVVM中,永遠不要訪問后面代碼中的控件名稱,而用this.DataContext = gridModel; 還添加

   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;
            OnPropertyChanged("SelectedRow");
        }


    }

更改列表框中的項目時,所選行的值將更新。您可以放置​​調試器並檢查值。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM