This course will be retired on July 14, 2025.

Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll

ASP.NET MVC Forms

Well done!

You have completed ASP.NET MVC Forms!

Sign up for Treehouse Back to Library
Preview
Video Player
00:00
00:00
00:00
  1. 2x 2x
  2. 1.75x 1.75x
  3. 1.5x 1.5x
  4. 1.25x 1.25x
  5. 1.1x 1.1x
  6. 1x 1x
  7. 0.75x 0.75x
  8. 0.5x 0.5x
Use Up/Down Arrow keys to increase or decrease volume.

Completing Our Model Related Updates

6:23 with James Churchill

Before we test our model related updates, let’s make one more change to our controller.

Before we test our updates, let's make one more change to our Controller. 0:00
When processing a post request for 0:05
my add entry form, if we have a valid entry data model instance, 0:07
we need to save the entry and display the entry's list page back to the user. 0:11
Remember how the ModelState contained a collection of the request 0:16
form field values. 0:19
And for each of those values, 0:21
a collection of errors, given that the model state object is tracking all of 0:22
the form field value errors, it's able to tell us if our model is in a valid state. 0:26
We just need to add an if statement to check if the ModelStates 0:31
is valid property, is true. 0:35
If the model state is valid, we can save the entry data model instance 0:40
by calling the repositories at entry method. 0:44
And then we can display the entries list page 0:47
instead of redisplaying the AddEntry page. 0:50
We'll save doing that for the next video. 0:56
Let's move our breakpoint up to the beginning of the method and 0:59
press F5 to start our app. 1:02
The first thing that catches my eye is the date field value. 1:07
Now that we're using our entry data model and we've defaulted its date property 1:10
to today, we're getting both a date and a time. 1:15
This is happening because MVC calls the to string method on the date time value, 1:19
to get the textual representation of that value 1:24
when rendering the input elements value attribute. 1:27
The date time to string method returns a string containing both a date and a time. 1:30
We can customize the formatting of the value by using a different text box for 1:36
method overload. 1:40
The fifth overload accepts a format parameter, 1:42
which allows us to provide a string for the value format. 1:45
Behind the scenes, MVC is calling the string format method 1:49
with our provided format and the date field value. 1:53
Let's look at an example. 1:57
Var formattedDate = String.Format and 2:03
our format string and our value 2:10
model.Date and a semicolon. 2:15
If you haven't seen a format string before, it can look a little odd at first. 2:21
The format string is simply a string that contains one or more format items. 2:26
Format items are defined using a set of curly braces surrounding a number 2:32
that represents the index of the object whose string value will be inserted. 2:37
We're only working with one value here. 2:41
Our model date value. 2:46
So we'll use 0 for the index. 2:48
Then we can follow the index with a colon and a date time format. 2:51
I can never seem to remember the date time format strings that are available to use. 2:57
Let's open a new tab and search for 3:02
c#, standard, date, format, strings. 3:07
The first result is the page that we're looking for, the standard date and 3:14
time format strings page on MSDN. 3:18
If we scroll down a bit, 3:22
we can see that there are a variety of standard format strings available. 3:24
A lowercase d that will give us a short date pattern, and 3:28
an upper case D that will give us a long date pattern, and so on. 3:33
You can see an example of the output here on the right. 3:38
I want a short date pattern, so I'm going to go with the lower case D. 3:42
You can also create custom date and time format strings. 3:46
See the teachers notes for more information. 3:49
Let's add our format to the text box for method call. 3:53
Curly braces with 0 for the index followed by a colon and 3:58
a lowercase d, for our short date pattern. 4:03
Then let's remove our temporary example. 4:07
Press Ctrl + S to save the View and 4:09
refresh the page to see how this affects our date value. 4:14
Great! 4:18
That remove the time portion just like we wanted. 4:18
Lets change the activity value to 1 duration to 23 and 4:21
Notes to this is my note and save the form. 4:27
Here we are at our break point. 4:37
If we expand the entry parameter in the locals window, 4:39
we can see that all of our values have flowed correctly to our data model. 4:42
We can also hover over the ModelState.IsValid property 4:49
to see that is currently true which is what we'd expect. 4:52
Press F10 twice to move down to the repositories AddEntry method call. 4:57
I'll press F10 one more time to execute the method call. 5:02
Now we're at the end of our IF block. 5:06
In a bit we will work on displaying our entries list page but 5:09
for now we're just going to see your AddEntry page again. 5:12
Press F5 to continue. 5:16
This time let's remove the duration field value and save the form. 5:18
We're at our break point again. 5:27
The ModelState.IsValid property is false, which is what we want it to be, 5:29
given that we didn't supply a duration field value. 5:34
Press F5 to continue, and we're back on our form. 5:37
Ideally there'd be a validation message here, 5:41
letting us know that we need to supply a duration field value. 5:44
We'll implement that later in this course. 5:47
Go ahead and stop the app. 5:50
If you're using GitHub, let's commit our changes. 5:53
Enter a commit message of, 5:58
Updated the "AddEntry" controller and 6:01
view to use the Entry data model and click the commit all button. 6:06
Let's wrap up this section by updating our Add action method 6:15
to display the entries list page after successfully adding an entry. 6:18