简体   繁体   中英

wpf-mvvm how can i validate my data with icommand?

I'm new to WPF development and I don't get any further with google either. I don't understand how I can validate my model data with ICommand . I understand that there are annotations and that the ICommand interface offers a canExecute method. For example I want to say that the Name and the Surname is required. I tried it with [Required(ErrorMessage = "Title is required.")] in my Model class, but I don't get it to work. may someone can help me.

So far I have the following:

public class Student : INotifyPropertyChanged
{
    private string name;
    private string surname;
    private int age;
    private string course;

    public string Course
    {
        get { return course; }
        set 
        { 
            course = value;
            OnPropertyChanged();
        }
    }

    public int Age
    {
        get { return age; }
        set
        {
            age = value;
            OnPropertyChanged();
        }
    }

    public string Surname
    {
        get { return surname; }
        set
        {
            surname = value;
            OnPropertyChanged();
        }
    }

    public string Name
    {
        get { return name; }
        set
        {
            name = value;
            OnPropertyChanged();
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;

    public void OnPropertyChanged([CallerMemberName] string name = null)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(name));
    }
}



public class StudentViewModel
{
    private IList<Student> _studentList;

    public StudentViewModel()
    {
        _studentList = new List<Student>
        {
            new Student{Name="Todd",Surname="Johnsen",Age=29,Course="Software-Development"},
            new Student{Name="Mike",Surname="Kroshka",Age=31,Course="Marketing"},
            new Student{Name="Marie",Surname="Tedd",Age=21,Course="Marketing"},
            new Student{Name="Susane",Surname="Müller",Age=31,Course="Marketing"},
            new Student{Name="Herbert",Surname="Rehl",Age=18,Course="Software-Development"},
            new Student{Name="Markus",Surname="Stanz",Age=23,Course="Software-Development"},
            new Student{Name="Sabine",Surname="Bergsen",Age=19,Course="Marketing"}
        };
    }

    public IList<Student> Students
    {
        get { return _studentList; }
        set { _studentList = value; }
    }

    private ICommand mUpdater;
    public ICommand UpdateCommand
    {
        get
        {
            if(mUpdater == null)
            {
                mUpdater = new Updater();
            }
            return mUpdater;
        }
        set
        {
            mUpdater = value;
        }
    }
}

 public class Updater : ICommand
{
    public bool CanExecute(object parameter)
    {
        return true;
    }

    public event EventHandler CanExecuteChanged;

    public void Execute(object parameter)
    {
        
    }
}

<Window x:Class="Student_list_mvvm_wpf_core.MainWindowView"
    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:Student_list_mvvm_wpf_core"
    mc:Ignorable="d"
    Title="Student-list" Height="350" Width="600">
<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="auto"></ColumnDefinition>
        <ColumnDefinition Width="*"></ColumnDefinition>
        <ColumnDefinition Width="*"></ColumnDefinition>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="auto"></RowDefinition>
        <RowDefinition Height="auto"></RowDefinition>
        <RowDefinition Height="auto"></RowDefinition>
        <RowDefinition Height="auto"></RowDefinition>
        <RowDefinition Height="*"></RowDefinition>
    </Grid.RowDefinitions>
    
    <Label Grid.Row="0">Name</Label>
    <Label Grid.Row="1">Surname</Label>
    <Label Grid.Row="2">Age</Label>
    <Label Grid.Row="3">Course</Label>
    <Button x:Name="btnUpdateStudent" Grid.Row="3" Grid.Column="2"
            Width="100" Margin="2" HorizontalAlignment="Left"
            Command="{Binding Path=UpdateCommand}">Update Student</Button>
    <ListView x:Name="studentGrid" ItemsSource="{Binding Students}"
              Grid.Row="4" Grid.ColumnSpan="3" Margin="5">
        <ListView.View>
            <GridView x:Name="gridStudent">
                <GridViewColumn Header="Name" DisplayMemberBinding="{Binding Name}" Width="100" />
                <GridViewColumn Header="Surname" DisplayMemberBinding="{Binding Surname}" Width="100" />
                <GridViewColumn Header="Age" DisplayMemberBinding="{Binding Age}" Width="50" />
                <GridViewColumn Header="Course" DisplayMemberBinding="{Binding Course}" Width="200" />
            </GridView>
        </ListView.View>
    </ListView>
    <TextBox Grid.Row="0" Grid.Column="1" Width="200"
             HorizontalAlignment="Left" Margin="2"
             Text="{Binding SelectedItem.Name, ElementName=studentGrid}"
             x:Name="txtName"></TextBox>
    <TextBox Grid.Row="1" Grid.Column="1" Width="200"
             HorizontalAlignment="Left" Margin="2"
             Text="{Binding SelectedItem.Surname, ElementName=studentGrid}"
             x:Name="txtSurname"></TextBox>
    <TextBox Grid.Row="2" Grid.Column="1" Width="200"
             HorizontalAlignment="Left" Margin="2"
             Text="{Binding SelectedItem.Age, ElementName=studentGrid}"
             x:Name="txtAge"></TextBox>
    <TextBox Grid.Row="3" Grid.Column="1" Width="200"
             HorizontalAlignment="Left" Margin="2"
             Text="{Binding SelectedItem.Course, ElementName=studentGrid}"
             x:Name="txtCourse"></TextBox>
</Grid>

Using IDataErrorInfo to validate your model looks more suited in your case. First , Update your ViewModel to have a property that bound to the ListView 's SelectedItem :

  public Student SelectedStudent
  {
        get { return _selectedStudent; }
        set { _selectedStudent = value; }
  }

Second , update the Student 's model to do data validation:

public class Student : INotifyPropertyChanged, IDataErrorInfo
{
    private string name;
    private string surname;
    private int age;
    private string course;

    public string Course
    {
        get { return course; }
        set
        {
            course = value;
            OnPropertyChanged();
        }
    }

    public int Age
    {
        get { return age; }
        set
        {
            age = value;
            OnPropertyChanged();
        }
    }

    public string Surname
    {
        get { return surname; }
        set
        {
            surname = value;
            OnPropertyChanged();
        }
    }

    public string Name
    {
        get { return name; }
        set
        {
            name = value;
            OnPropertyChanged();
        }
    }

    public string Error => string.Empty;
    public string this[string columnName]
    {
        get
        {
            string result = null;
            if (columnName == "Name")
            {
                if (string.IsNullOrEmpty(Name))
                    result = "Name is required.";
            }
            if (columnName == "Surname")
            {
                if (string.IsNullOrEmpty(Surname))
                    result = "Surname is required.";
            }
            return result;
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;

    public void OnPropertyChanged([CallerMemberName] string name = null)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(name));
    }
}

Finally , update your xaml: -Bind between your ListView's SelectedItem and the Property that you've created. -Validate the TextBox's Text

<TextBox Grid.Row="0" Grid.Column="1" Width="200"
         HorizontalAlignment="Left" Margin="2"
         Text="{Binding SelectedStudent.Name,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged, ValidatesOnDataErrors=true, NotifyOnValidationError=False}"
         x:Name="txtName"></TextBox>
    <TextBox Grid.Row="1" Grid.Column="1" Width="200"
         HorizontalAlignment="Left" Margin="2"
         Text="{Binding SelectedStudent.Surname,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged, ValidatesOnDataErrors=true, NotifyOnValidationError=False}"
         x:Name="txtSurname"></TextBox>

-Add a MultiDataTrigger to enable and disable the Button when the suited conditions are met.

<Button x:Name="btnUpdateStudent" Grid.Row="3" Grid.Column="2"
        Width="100" Margin="2" HorizontalAlignment="Left"
         Content="Update Student" Command="{Binding UpdateCommand}">
        <Button.Style>
            <Style TargetType="{x:Type Button}">
                <Setter Property="IsEnabled" Value="False" />
                <Style.Triggers>
                    <MultiDataTrigger>
                        <MultiDataTrigger.Conditions>
                            <Condition Binding="{Binding ElementName=txtName, Path=(Validation.HasError)}" Value="false" />
                            <Condition Binding="{Binding ElementName=txtSurname, Path=(Validation.HasError)}" Value="false" />
                        </MultiDataTrigger.Conditions>
                        <Setter Property="IsEnabled" Value="True" />
                    </MultiDataTrigger>
                </Style.Triggers>
            </Style>
        </Button.Style>
    </Button>

Output:

在此处输入图片说明

Here is a Gist for the full source. If you insist on using the canExecute , this should help.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM