- Introducing Form Validation 4:04
- Form Validation 5 questions
- Implementing Server-Side Validation Using ModelState 5:45
- Adding Server-Side Validations Using ModelState 1 objective
- Implementing Server-Side Validation Using Data Annotations 4:36
- Adding Server-Side Validations Using Data Annotations 1 objective
- Displaying Validation Messages 5:31
- Displaying Validation Messages 1 objective
- Implementing Unobtrusive Client-Side Validation 10:11
- Improving Validation CSS Styles 6:03
- Section Review 5 questions
Preview
Video Player
00:00
00:00
Implementing Server-Side Validation Using ModelState
5:45Let’s see how we can implement server-side validation using ModelState.
There are two approaches for
implementing server side validation rules.
0:00
Adding errors directly to ModelState and
0:04
expressing rules using data
annotations on models.
0:07
Let's start by taking a look
at how we can use ModelState
0:10
to implement server side validation.
0:13
In a previous video, we saw how MVC's
model binder will add errors to the model
0:16
state errors collection,
when a request form field value
0:20
cannot be converted to
the model's expected data type.
0:24
Let's take a moment to review.
0:27
Navigate to the add post method, And
0:29
set a break point just inside
the method and press F5 to run the app.
0:34
Go ahead and
just save the form to hit our break point.
0:43
Using the Locals window let's
drill down into our model state.
0:48
If we expand values, and
then the second item's errors collection,
0:59
we can see that there's
a single model error.
1:03
Expanding that item we can
see the error message.
1:07
The activity field is required.
1:13
How did this error get here?
1:17
If we browse to the request form value,
1:19
we can see the data that
was posted to the server.
1:21
That text is a little small, I'll right
click on the value and select copy value.
1:27
Then switch to notepad and paste.
1:34
We can see here that our
activityID field is empty.
1:39
This makes sense as we didn't select
a value in the form's activity dropdown
1:43
list, and the first default selected
item in the list doesn't define a value.
1:47
Let's take a look at our entry
data models activity ID property.
1:53
When the MVC model binder attempts to
set our models activity ID property,
2:10
which is of type int, it correctly
determines that it can't convert
2:15
an empty value to an integer value.
2:19
And since our property doesn't allow null
values, the model binder adds an error,
2:22
with the message, the activity field is
required, to the errors collection for
2:28
the ActivityID field.
2:32
The presence of this error
causes the model state,
2:34
IsValid property, to be false.
2:37
Which causes our action method to
re-display the add entry form to the user.
2:40
Currently we're not displaying the model
state error messages anywhere on the page.
2:45
We'll fix that soon.
2:50
This automatic validation is helpful, but
2:51
we need a way to add our own
server side validation rules.
2:54
Fortunately, model state provides a method
that is specifically for that purpose.
2:57
Add model error.
3:02
Let's add a validation rule that
checks if the duration field value
3:04
is greater than zero.
3:07
We need to insert our validation rule
right before we check the model state
3:09
IsValid property.
3:13
That way, our validation rule has
a chance to influence the value
3:14
of the IsValid property.
3:18
First we'll start by using the ModelState
IsValid Field method to check if
3:20
the duration field is valid or not.
3:24
If it's not valid.
3:31
Meaning that the model binder was
unable to convert the form field value
3:33
to the underlying data type,
3:36
then there's no need to check at
the value is greater than zero.
3:38
Then we can check if the entry
duration property is less than or
3:42
equal to zero, I'll also
3:46
add a comment just above our if statement
that summarizes what this code is doing.
3:51
If there aren't any duration
3:58
field validation errors,
4:03
then make sure that the Duration
4:09
is greater than 0.
4:15
This will make it easier for anyone
else in our team including ourselves,
4:19
six months from now, to quickly
understand the goal of this if statement.
4:23
If our condition evaluates to true, then
we'll call the ModelState add model error
4:28
method The first parameter is the key,
which is Duration.
4:33
The second parameter is the error message
that will be displayed to the user.
4:42
Let's use The Duration
4:46
field value must be,
4:51
Greater than 0.
4:57
This is just an example of
a single validation rule.
5:01
We could add as many other
rules as we needed to.
5:04
Let's try building our project
by pressing Ctrl, Shift, B.
5:08
Here in the output window, we can see
that our project was successfully built.
5:11
If you're using GitHub,
let's commit our changes.
5:17
Enter a commit message of added
5:24
validation rules using ModelState.
5:28
And click the Commit All button.
5:34
Next, we'll see how you can use
data annotations on your models,
5:36
to implement server-side validation.
5:41