1
00:00:00,360 --> 00:00:08,940
This dude's or we will be looking at scaffolding and generating controllers and views for functionality

2
00:00:08,940 --> 00:00:11,420
in our Web sites.

3
00:00:11,430 --> 00:00:18,090
So far we've looked at what does a controller what is a view how they're laying clear go about creating

4
00:00:18,090 --> 00:00:21,000
a new view and attaching into a controller.

5
00:00:21,030 --> 00:00:26,640
What we didn't do was actually linking the model to everything.

6
00:00:26,670 --> 00:00:28,250
So we looked at the sea.

7
00:00:28,350 --> 00:00:29,910
We looked at the V.

8
00:00:29,910 --> 00:00:31,050
We've looked at the M.

9
00:00:31,050 --> 00:00:36,250
We've looked at them in fair isolation and know we're going to actually tie them all together.

10
00:00:36,270 --> 00:00:42,990
So in this tutorial we look at a procedure or process in Visual Studio and most MVC frameworks that

11
00:00:42,990 --> 00:00:50,820
you'll use called scaffolding where we associate the model with a controller and generate the view accordingly.

12
00:00:52,070 --> 00:01:01,430
Now I have here on screen my entity framework diagram and what we will be doing to begin with is create

13
00:01:01,550 --> 00:01:11,600
a course control and some views associated with crowed functionalities for courses in short C is for

14
00:01:11,600 --> 00:01:22,010
create R is for read U is for update and D is delete so CRUD operations basically manage or govern everything

15
00:01:22,010 --> 00:01:29,750
that a user would ever do on a Web site that is data driven so without further ado we will go about

16
00:01:29,780 --> 00:01:40,070
creating courses controller linking it to our course model and generating a bunch of views that allow

17
00:01:40,070 --> 00:01:44,410
us to interact with our courses in our database.

18
00:01:44,570 --> 00:01:52,520
So to start this procedure we go over to our controllers folder we right click and click and then we

19
00:01:52,520 --> 00:01:54,960
select controller.

20
00:01:55,240 --> 00:02:00,830
Then we're given this kind of wizard window where they ask us what kind of controller would you like

21
00:02:00,880 --> 00:02:07,210
to see here you have MVC 5 you have web API 2 with a bunch of other things while you were the one told

22
00:02:07,220 --> 00:02:14,930
of this one is MVC 5 controller with views using entity framework very specific.

23
00:02:14,930 --> 00:02:18,110
So we split this one and then we click at

24
00:02:21,850 --> 00:02:26,290
then they ask us what would you like as the model class.

25
00:02:26,380 --> 00:02:33,310
So from this dropdown we'll see every single CSR file that is in our project listed here but we're not

26
00:02:33,310 --> 00:02:40,300
interested in every single CSR file we're looking specifically for the one with the name that corresponds

27
00:02:40,300 --> 00:02:41,230
with our mission.

28
00:02:41,290 --> 00:02:50,370
So in this situation we want the course which is found in our models folder and remember if we drilled

29
00:02:50,370 --> 00:02:56,220
on into the idea Max we would see the CSR file through that quickly and give you some context.

30
00:02:56,230 --> 00:03:02,110
So we drilled into models we have our entity framework diagram we drill into that and then down here

31
00:03:02,110 --> 00:03:08,890
you'll see that you do have course that C S and that is the model that we want to use to generate this

32
00:03:08,890 --> 00:03:09,650
controller.

33
00:03:09,970 --> 00:03:16,930
So once again we are actually controllers we go to add weekly controller we select MVC 5 controller

34
00:03:16,930 --> 00:03:28,430
with views using entity framework and click Add then we select from this dropdown box course and the

35
00:03:28,430 --> 00:03:38,320
data context class would be our school management DB entities and so we can just select that we can

36
00:03:38,320 --> 00:03:44,820
choose to use async controller actions for void this time and then use it the next time and then they're

37
00:03:44,830 --> 00:03:50,080
asking us which labeled page would we like to use for our views.

38
00:03:50,080 --> 00:03:55,780
So we see here we have a checkboxes generate views we have a chat box here this is reference script

39
00:03:55,780 --> 00:04:01,480
libraries which we really don't need to do since our little page already has the references so we will

40
00:04:01,480 --> 00:04:09,790
just select or label a page by clicking the ellipsis button there we're going to views shared and then

41
00:04:09,790 --> 00:04:11,410
we select our layouts.

42
00:04:11,500 --> 00:04:17,290
Once again you can have multiple layouts so you choose a label that is appropriate for this situation

43
00:04:17,800 --> 00:04:22,710
and then by the end of it there would be asking for the controller name where you can see following

44
00:04:22,720 --> 00:04:29,560
the same naming convention it is auto generated using the name off the model which is course the same

45
00:04:29,560 --> 00:04:33,130
courses and the word controller.

46
00:04:33,250 --> 00:04:37,180
So the naming convention maintains that we click add

47
00:04:40,950 --> 00:04:49,770
it will go through a scaffolding exercise at the end of this exercise you'll be given a class file and

48
00:04:49,770 --> 00:04:54,720
you'll see much more code than we're used to from our home controller.

49
00:04:55,710 --> 00:05:01,440
Now once again our controller is just a class with the name of the model.

50
00:05:01,440 --> 00:05:07,980
In this situation and the word controller is inheriting from a base class called controller.

51
00:05:07,980 --> 00:05:12,340
Then they go about initializing our data.

52
00:05:12,360 --> 00:05:19,510
Context object which allows us to communicate with our database.

53
00:05:19,510 --> 00:05:23,350
Remember keep on saying that this diagram is our bridge.

54
00:05:23,390 --> 00:05:28,580
This bridge is all invoked in this one line.

55
00:05:28,580 --> 00:05:38,840
Here in line 15 so we initialize this object to a new instance of our entities diagram which establishes

56
00:05:38,840 --> 00:05:41,630
the connection to our database.

57
00:05:41,630 --> 00:05:47,270
Then if we look through we'll see that we have quite a few methods that were generated and some comments

58
00:05:47,270 --> 00:05:49,680
to guide us as to what is happening here.

59
00:05:49,700 --> 00:05:51,290
So the first one is index.

60
00:05:51,290 --> 00:05:58,650
Remember as always indexes the first file that should ever be in any website.

61
00:05:58,760 --> 00:06:01,530
And this one returns a view.

62
00:06:01,580 --> 00:06:08,760
But then in this situation we see that we have parameters in this view all right.

63
00:06:09,070 --> 00:06:13,770
So you see that you have VB which is the same name as our database context.

64
00:06:14,020 --> 00:06:20,740
And we're running a query against the courses table and we're just passing all of those to list

65
00:06:24,100 --> 00:06:25,130
for the domain.

66
00:06:25,140 --> 00:06:30,370
You have a detailed speech which is taking probably an integer.

67
00:06:30,390 --> 00:06:30,710
All right.

68
00:06:30,740 --> 00:06:33,380
So that question mark really means that it could be.

69
00:06:33,390 --> 00:06:33,900
No.

70
00:06:33,930 --> 00:06:36,210
It could be a value.

71
00:06:36,210 --> 00:06:42,540
It is preparing that it might be a no idea value that is coming in and then it has a cursory check to

72
00:06:42,540 --> 00:06:51,900
see if the idea that is passed in is no then return some bad request code right.

73
00:06:52,410 --> 00:06:57,180
Otherwise it will go on to source that course by I.D..

74
00:06:57,210 --> 00:07:06,150
So this is DB that courses that find find will return any record with this I.D. and store it in a variable

75
00:07:06,150 --> 00:07:12,450
called course and then it will go on to see if the course that is returned is no meaning nothing comes

76
00:07:12,450 --> 00:07:18,630
back at the end of this query then it still sees issue ATP not phone.

77
00:07:18,630 --> 00:07:23,790
So you see quite a few returns here and none of them are views right.

78
00:07:23,810 --> 00:07:26,060
So action results.

79
00:07:26,070 --> 00:07:26,650
What then.

80
00:07:26,670 --> 00:07:29,720
Action Result allows you to have different values return.

81
00:07:29,730 --> 00:07:35,310
As long as you have the card value or an acceptable value then you have a card to return type.

82
00:07:35,340 --> 00:07:43,560
So we can return each GDP those quarter results for Butters but request we can return if GDP is not

83
00:07:43,560 --> 00:07:49,570
phoned or we can return view with our sourced course.

84
00:07:49,580 --> 00:07:49,910
All right.

85
00:07:49,920 --> 00:07:51,470
So we looked for the course.

86
00:07:51,570 --> 00:08:00,150
And then once nothing is no and everything checks out then we return the view with our course data.

87
00:08:00,150 --> 00:08:06,370
We also have a create method stub and we go on to see that there to create methods.

88
00:08:06,470 --> 00:08:09,660
So we have one to get which just returns of you.

89
00:08:09,780 --> 00:08:16,800
And then one for posting which comes with some security features and some binding and as we go along

90
00:08:16,800 --> 00:08:19,200
we'll explore them more.

91
00:08:19,290 --> 00:08:29,200
And this one makes sure that the data coming back is valid before it goes up both adding it to our database.

92
00:08:29,260 --> 00:08:38,530
Our course is stable in our database and then saving the changes and then redirecting to index if the

93
00:08:38,530 --> 00:08:46,810
state is invalid then it returns to the view with the course with some error messages stating what is

94
00:08:46,810 --> 00:08:52,600
missing or what was involved in the same way we have to create we have to edit.

95
00:08:52,600 --> 00:08:59,330
So we have one edit here which is I get and we have one edit here which is of course then the code bases

96
00:08:59,330 --> 00:09:00,820
that are quite similar.

97
00:09:01,030 --> 00:09:08,580
And then we have a similar construct for our deletes and then we have a dispose function.

98
00:09:08,590 --> 00:09:12,630
So all of this was generated just by you adding a controller.

99
00:09:12,640 --> 00:09:16,120
Having the class generating the views and you get all of this.

100
00:09:16,120 --> 00:09:21,670
So the key in what I just said was generating the views we have the methods.

101
00:09:21,700 --> 00:09:27,190
So we have to ensure that we have the views that correspond with these methods in a corresponding folder

102
00:09:27,190 --> 00:09:28,780
for this controller.

103
00:09:28,780 --> 00:09:36,520
So if I go to my solution Explorer I see here that control those added courses controller but then I

104
00:09:36,520 --> 00:09:43,720
need to validate the views and if we go to interviews we see here courses that name just collapse this

105
00:09:45,070 --> 00:09:51,970
the names correspond courses controller courses folder and you'll see that for each method that is here

106
00:09:51,970 --> 00:10:01,710
in the controller you have a corresponding file so if we click index we will see quite a few things

107
00:10:01,710 --> 00:10:11,380
happening here that was not present on the previous index but so we have here the inclusion of a model

108
00:10:12,620 --> 00:10:13,710
right on this type.

109
00:10:13,710 --> 00:10:18,090
I enumerable so C Sharp has quite a few data types.

110
00:10:18,180 --> 00:10:23,190
If you've been doing this thing for a while I'm sure this wouldn't be very foreign to you but you have

111
00:10:23,190 --> 00:10:30,660
this being included because in all fairness the index file is getting a list right.

112
00:10:30,720 --> 00:10:36,260
So remember over here we're passing up a list into index of DV.

113
00:10:36,270 --> 00:10:38,550
That course is to list.

114
00:10:38,640 --> 00:10:41,500
So it is getting a collection type.

115
00:10:41,500 --> 00:10:48,300
All right this is getting a list of course is a index page should display all of the courses.

116
00:10:48,300 --> 00:10:50,180
I'm sorry that's the wrong index file.

117
00:10:50,550 --> 00:10:57,090
All of the courses that would have been in the database as at the time of you loading this speech are

118
00:10:57,500 --> 00:11:03,810
and they have quite a few things happening here you have this create button action linked for create

119
00:11:04,380 --> 00:11:10,980
and because index and create are in the same controller you don't have to explicitly refer to the controls

120
00:11:11,080 --> 00:11:19,680
it could put on or you could put on the controller in the name which courses you can redirect to another

121
00:11:19,680 --> 00:11:20,760
controller.

122
00:11:20,760 --> 00:11:25,320
Of course this would feel because there's no create inside of the home controller.

123
00:11:25,330 --> 00:11:25,900
Right.

124
00:11:25,980 --> 00:11:30,920
But then by virtue of the fact that they are in the same controller you don't have to be that explicit

125
00:11:30,930 --> 00:11:32,970
moving from index to create.

126
00:11:33,240 --> 00:11:37,470
So this works then we go on to create a table.

127
00:11:37,500 --> 00:11:44,710
We have two properties for our courses table that don't include the idea.

128
00:11:44,710 --> 00:11:46,230
So we have ideas with type.

129
00:11:46,250 --> 00:11:51,320
Then what creates we don't need to display the idea and MVC knows you don't need to display the idea

130
00:11:51,330 --> 00:11:56,550
so and they generated this speech they made sure to just exclude what they figure you wouldn't want

131
00:11:56,550 --> 00:12:00,030
to display to the the end user anyway.

132
00:12:00,180 --> 00:12:09,120
So we have a display name for title and one for credits and all of those are both of those are put into

133
00:12:09,420 --> 00:12:17,730
the header section of our table and then we see them injecting some C sharp code here where they say

134
00:12:17,730 --> 00:12:19,770
for each.

135
00:12:19,890 --> 00:12:20,360
All right.

136
00:12:20,370 --> 00:12:29,040
So they're seeing for each item in module model being this here or the data coming back.

137
00:12:29,040 --> 00:12:33,750
So once you pass the data into the view you can reference it by seeing module.

138
00:12:33,750 --> 00:12:35,550
That's a keyword right there.

139
00:12:35,580 --> 00:12:41,940
So all of the data and just by hovering over the tooltip is indicating that this reference is the collection

140
00:12:42,090 --> 00:12:45,390
of course is coming from the database.

141
00:12:45,540 --> 00:12:54,000
Once again courses controller index where querying our database looking in our courses table and getting

142
00:12:54,060 --> 00:13:00,480
all of them and passing them to list and passing that into the view the view can identify all of that

143
00:13:00,480 --> 00:13:07,500
data coming in through the keyword called module since it's a collection we need to list everything

144
00:13:07,500 --> 00:13:09,580
in that clinic collection.

145
00:13:09,660 --> 00:13:19,290
So we see for each item in the model or set of data coming back we want our rule.

146
00:13:19,320 --> 00:13:26,520
So for each item we want to generate our rule and this rule should have one column for the title and

147
00:13:26,520 --> 00:13:35,310
one column for our credits and then a third column with our action buttons which would see edit details

148
00:13:35,550 --> 00:13:42,220
and delete which each will wrote to the corresponding methods in our control.

149
00:13:42,570 --> 00:13:51,030
All right so remember in our courses controller we had edits and added quickly we have edits we had

150
00:13:51,150 --> 00:13:59,330
create we have to both create and we have details and we also have delete.

151
00:13:59,430 --> 00:14:04,810
No we need to be able to browse to this page or any one of our pages.

152
00:14:04,830 --> 00:14:12,330
I'm going to go to our layout page and make sure that our leaflet has a link that can bring us to that

153
00:14:12,330 --> 00:14:20,240
index page so I'll remove our previously created test view link as we don't need it going forward.

154
00:14:20,280 --> 00:14:31,530
And I will just manually type this out so I am creating a new nav property or NAV link setting an action

155
00:14:31,530 --> 00:14:42,120
link so I'd sign each t o dot action link and then I'm passing in as parameters what I want to be printed

156
00:14:42,150 --> 00:14:50,400
I know what I want to be printed would be course is just print of course is and then we're looking inside

157
00:14:50,490 --> 00:15:01,720
of the index sorry we're looking for the index method inside of our courses.

158
00:15:01,800 --> 00:15:04,300
Controller.

159
00:15:04,390 --> 00:15:04,910
All right.

160
00:15:04,920 --> 00:15:15,480
So remember it is what is displayed the action or the view that we want and the controller that we should

161
00:15:15,480 --> 00:15:16,650
be able to find it in

162
00:15:20,380 --> 00:15:27,270
now having done all of that we hit F5 and see what happens.

163
00:15:27,400 --> 00:15:31,220
Now this is the result of our page so far.

164
00:15:31,290 --> 00:15:39,640
And we see here that we have a link called courses when we click that we should be guided to our index

165
00:15:39,640 --> 00:15:40,660
page.

166
00:15:40,720 --> 00:15:44,320
And when that page loads we see it is empty.

167
00:15:44,320 --> 00:15:46,010
We'd love anything in our database.

168
00:15:46,030 --> 00:15:46,360
Right.

169
00:15:46,830 --> 00:15:52,540
But then we see it's consistent with what we saw in the view we have index which I believe is in an

170
00:15:52,560 --> 00:15:53,500
H to tag.

171
00:15:53,500 --> 00:16:00,040
We have a link that says create new which when we click it should lead us to our create form and then

172
00:16:00,040 --> 00:16:03,130
we have the two headings for our tables.

173
00:16:03,160 --> 00:16:07,540
But we have no rules and columns afterwards because we have no data.

174
00:16:07,540 --> 00:16:13,470
Remember it is generating each row for what is in the database.

175
00:16:13,480 --> 00:16:19,480
If the database is empty then no rules will be generated that for each loop will not run.

176
00:16:19,480 --> 00:16:22,930
So let's us go about creating something new.

177
00:16:25,000 --> 00:16:32,680
So create new brings us store create view which asks us for a title and the credits.

178
00:16:32,710 --> 00:16:39,970
So you see the create view is actually auto generating and I'll just head over to visual studio while

179
00:16:39,970 --> 00:16:44,000
we're still in debug mode and take a look at the create view.

180
00:16:44,470 --> 00:16:47,450
We see it generated a form.

181
00:16:47,500 --> 00:16:47,790
All right.

182
00:16:47,790 --> 00:16:56,380
So there is an issue and a helper function called begin form which renders out a form in each demo and

183
00:16:56,380 --> 00:16:58,820
then using some bootstrap code.

184
00:16:58,820 --> 00:17:07,270
We're getting a form here that does a validation summary with a class attached to it and there's a certain

185
00:17:07,270 --> 00:17:12,580
pattern here that as you see the code more and more and you catch onto the pattern.

186
00:17:12,610 --> 00:17:18,550
So I'm deliberately not going into the details of certain things because I want you to see and appreciate

187
00:17:18,550 --> 00:17:23,650
the pattern as you go along those certain things will come to light more and more and then we have a

188
00:17:23,650 --> 00:17:24,260
div.

189
00:17:24,510 --> 00:17:26,650
And in this div we have a label.

190
00:17:27,250 --> 00:17:35,800
So you see another issue on a helper function being used and we're looking at the model and we're creating

191
00:17:37,190 --> 00:17:42,770
a label for a title and giving it some bootstrap classes.

192
00:17:42,840 --> 00:17:43,980
Sorry.

193
00:17:44,200 --> 00:17:44,590
All right.

194
00:17:45,250 --> 00:17:49,180
And then down here we generate an editor for.

195
00:17:49,180 --> 00:17:54,430
So there's a helpful function that says editor for pretty much this just says I will look at the data

196
00:17:54,430 --> 00:17:59,560
type that I'm supposed to create a control for and creates an appropriate control.

197
00:17:59,590 --> 00:18:06,250
So if we had a boolean for our human C that we needed to create something for editor four would automatically

198
00:18:06,250 --> 00:18:14,160
generate that checkbox so there are situations where you want to use editor for four E's and there are

199
00:18:14,160 --> 00:18:21,560
times when you need to be explicit so you could see each some of that takes the box for all right so

200
00:18:21,560 --> 00:18:22,880
you can be explicit.

201
00:18:23,010 --> 00:18:27,950
And there are certain times you want to be very explicit because it is therefore has some limitations

202
00:18:27,970 --> 00:18:36,400
takes looks for comes with more text box related functions that allow you to do a few things otherwise.

203
00:18:36,650 --> 00:18:42,920
So we want a text box for our model and then we have a little lambda expression here to see a model

204
00:18:43,000 --> 00:18:49,250
about title and then we're adding Isham attributes if you remember from each demo when you have a nation.

205
00:18:49,250 --> 00:18:56,570
I'll tell you I can add in attributes such as I.T. class please holder when it comes to text boxes.

206
00:18:56,960 --> 00:19:02,300
So we're adding new customer attributes and remember this is all a C sharp.

207
00:19:02,300 --> 00:19:07,230
So we have to treat it a bit differently from how we would have in St. ECMO.

208
00:19:07,910 --> 00:19:11,110
So we're adding emotional attributes we're adding.

209
00:19:11,300 --> 00:19:16,220
Once again another is another collection of attributes.

210
00:19:16,220 --> 00:19:21,860
Now if you use text box for then some of the code here will also have to change.

211
00:19:22,010 --> 00:19:26,720
So you won't be able to see new age or attributes in this manner.

212
00:19:26,720 --> 00:19:28,800
You'll have to refractory your code a bit.

213
00:19:28,820 --> 00:19:34,720
So to not complicate the situation as we're just waiting our appetites.

214
00:19:34,730 --> 00:19:39,140
I leave it to an editor for and then we'll move along.

215
00:19:39,460 --> 00:19:45,250
So we see editor for is increasing our text box and it's assigning a bootstrap class called form dash

216
00:19:45,250 --> 00:19:46,970
control to it.

217
00:19:47,020 --> 00:19:53,970
We also have another section for validation message which means that if we stipulate that at the database

218
00:19:53,980 --> 00:20:01,480
level that this field is not knowable then the validation message would know that once we try to submit

219
00:20:01,740 --> 00:20:10,600
and no value or an empty field when we click submit on our form it will reject it like we saw in our

220
00:20:10,600 --> 00:20:15,130
controller logic where it checks is valid.

221
00:20:15,130 --> 00:20:21,790
So if it is not valid then it will reject the tentative return to view with whatever values came back

222
00:20:22,330 --> 00:20:30,880
and the validation message would show accordingly so it does a lot of the heavy lifting for us.

223
00:20:31,010 --> 00:20:38,060
And then at the end of it all we have our Submit button which just gets a bootstrap class or defaults

224
00:20:38,060 --> 00:20:40,830
on which it changes to success.

225
00:20:40,850 --> 00:20:46,970
So having changed it to success to just save changes we're still in debug mode and we just go back to

226
00:20:46,970 --> 00:20:54,630
our screen and refresh and although it's to reload our page with our changes and there we go.

227
00:20:54,800 --> 00:20:58,060
Now let's go about creating a new course.

228
00:20:58,070 --> 00:21:05,030
So I'll call this one introduction to web design.

229
00:21:05,620 --> 00:21:07,880
I'll make sure I got my spending right.

230
00:21:07,880 --> 00:21:13,370
And then the like I was seeing with the edit for it knows that credits is supposed to be an integer

231
00:21:13,700 --> 00:21:15,850
so it is actually giving us a text box.

232
00:21:15,860 --> 00:21:17,210
I'm actually typing text right.

233
00:21:17,210 --> 00:21:24,440
No I'm not accepting it because the control that it's generating for it is a no thicker soft type no

234
00:21:24,440 --> 00:21:33,130
picker if I inspect element I'm sure I'll see input type to be no.

235
00:21:33,170 --> 00:21:34,240
There we go.

236
00:21:34,280 --> 00:21:38,450
So it is restricting me and what I am able to enter.

237
00:21:38,450 --> 00:21:41,510
So usually introduction to web design is a three credit course.

238
00:21:41,540 --> 00:21:44,760
I just could create and there we go.

239
00:21:44,760 --> 00:21:49,440
So we go back to our index page right.

240
00:21:49,570 --> 00:21:57,730
And now we see that we have a generated row with two columns one for the title one for the credits and

241
00:21:57,730 --> 00:22:06,010
then another column which had or action buttons or edit details and delete and each one will bring me

242
00:22:06,010 --> 00:22:09,970
to the corresponding page according to the title.

243
00:22:09,970 --> 00:22:18,370
So if I click edit and I'm actually going to bring up visual studio this time around and puts a breakpoint

244
00:22:18,460 --> 00:22:21,820
on our edit action.

245
00:22:21,850 --> 00:22:22,140
All right.

246
00:22:22,150 --> 00:22:29,470
So each method here is called an action so the breakpoint is sitting there were still in debug mode.

247
00:22:29,470 --> 00:22:40,710
And then I'm going to click edit and then we take the time out to dissect what happens in Visual Studio.

248
00:22:40,880 --> 00:22:42,450
So the breakpoint is hit.

249
00:22:42,560 --> 00:22:45,730
And then if I hover over idea I see that I want.

250
00:22:45,800 --> 00:22:55,840
And that's because our newly created record in our courses table has an idea of 1 and then if we step

251
00:22:55,930 --> 00:23:04,840
through our code we see that if I.T. is equivalent to know this evaluates the falls.

252
00:23:04,850 --> 00:23:06,380
So it skips by that

253
00:23:11,020 --> 00:23:19,580
and then it goes on to run this query which then says Find the course with the IDA one.

254
00:23:20,070 --> 00:23:25,180
So I if I step by that it runs that query and it goes through some sort of

255
00:23:28,030 --> 00:23:30,390
and then it should return course.

256
00:23:30,400 --> 00:23:37,810
So if I hover over a course I'll see that it comes back with a bunch of generated values but I can drill

257
00:23:37,810 --> 00:23:39,700
down and see the exact details.

258
00:23:39,700 --> 00:23:46,650
And here we see that we have our credits being three and our title being introduction to web design.

259
00:23:46,750 --> 00:23:52,840
And like I was saying earlier once there is a relationship entity framework will automatically bring

260
00:23:52,840 --> 00:23:55,270
over whatever values are associated.

261
00:23:55,300 --> 00:24:01,330
So since we have no enrollments that are directly related to this particular course then the list of

262
00:24:01,330 --> 00:24:02,930
enrollments is zero.

263
00:24:02,940 --> 00:24:03,920
It's empty.

264
00:24:03,920 --> 00:24:04,180
All right.

265
00:24:05,200 --> 00:24:13,510
So if I press F5 it will continue to evaluate if the course is not known and we know it's not known

266
00:24:13,570 --> 00:24:15,300
because we just saw that it has a value.

267
00:24:15,310 --> 00:24:16,780
So the value is not no.

268
00:24:16,810 --> 00:24:24,610
So it will return the view with the corresponding data that we just looked up and that's all we engage

269
00:24:24,610 --> 00:24:29,440
in the editing procedure where it then says bring up this form.

270
00:24:29,450 --> 00:24:32,530
So we see it looks very similarly to our creates.

271
00:24:32,630 --> 00:24:39,020
Except it comes preloaded with all the data because we looked for the course got the data associated

272
00:24:39,020 --> 00:24:43,330
with the course and then passed it back to this view.

273
00:24:43,370 --> 00:24:51,020
Now if I make a change here the expectation is that the course would update when listed in the index.

274
00:24:51,020 --> 00:24:56,180
So I'm going to change this because we expanded our programs and our way of introduction to web design

275
00:24:56,480 --> 00:24:59,530
part 1 and then we'll have a part 2.

276
00:24:59,540 --> 00:25:06,020
I can also edit this view because I want the save button to look like green so I'm going to go back

277
00:25:06,020 --> 00:25:06,710
over here

278
00:25:10,300 --> 00:25:13,020
so I'm going to make a few changes here on this view.

279
00:25:13,030 --> 00:25:19,450
Either way I want to save button to be green much like on or create page so I'll go by here we're still

280
00:25:19,450 --> 00:25:23,900
in debug mode we'll go into the solution explorer find that view.

281
00:25:23,950 --> 00:25:30,610
So we're looking course this folder and we look for the edit view and we'll see that it looks very similar

282
00:25:30,610 --> 00:25:41,980
to our index create page and then we will modify our submit button to have Beatty and dash success once

283
00:25:41,980 --> 00:25:42,730
again.

284
00:25:42,730 --> 00:25:50,530
So as you go along you get all the generated code which is really just a guideline but you will be prompted

285
00:25:50,530 --> 00:25:57,760
and influenced to give it your or individual flair and change certain elements as you see fit.

286
00:25:57,760 --> 00:26:02,830
So if I go back here and refresh and you see it's hitting the breakpoints again I don't want it to do

287
00:26:02,830 --> 00:26:12,340
that so I just take off the brake points on clicked it and I just click continue and there we see that

288
00:26:12,340 --> 00:26:16,090
our patients reloaded and we have our green save button.

289
00:26:16,120 --> 00:26:24,080
Of course our changes were on done so this change again and then I click save and there we go.

290
00:26:24,140 --> 00:26:31,030
So the change was done and we now have introduction to web design one the same number of credits.

291
00:26:31,400 --> 00:26:39,950
And if I look at the details the details action is doing a very similar thing it's finding which course

292
00:26:39,980 --> 00:26:46,310
has the idea associated here of course that is not visible but if we hover over the button we'll see

293
00:26:46,310 --> 00:26:50,630
in the bottom left corner that the link is being displayed.

294
00:26:50,840 --> 00:26:58,730
So it's going to of course is lush detail slash one so that slash 1 is that parameter that gets passed

295
00:26:58,790 --> 00:27:08,240
into our action in the Parliament is I say if I look at details to be specific we'll see we can find

296
00:27:08,240 --> 00:27:14,220
details we see actions or details it's getting a Parramatta called.

297
00:27:14,750 --> 00:27:19,880
So whatever the idea is it's being blown to this link right here that such that when it is clicked it

298
00:27:19,880 --> 00:27:22,160
is going to be passed to the details.

299
00:27:22,160 --> 00:27:29,960
Action in the I.D. parameter and then it is evaluated making sure that we're not wasting the time because

300
00:27:30,800 --> 00:27:33,140
a database called Think of it as expensive.

301
00:27:33,140 --> 00:27:39,770
So you want to make sure that you vets your data as much as possible before a database call is required.

302
00:27:40,190 --> 00:27:46,400
So here we're just making sure that if nothing came over then don't bother to waste the time to try

303
00:27:46,400 --> 00:27:55,460
and look for something that's will be invalid so we check we validate that this idea value me.

304
00:27:55,580 --> 00:27:58,570
Well it may exist at this point we don't know yet.

305
00:27:58,640 --> 00:28:07,790
Then we try and find it and then we check if we phoned it and if we didn't we say not phone which is

306
00:28:07,790 --> 00:28:15,200
like four or four and if we did then we say please return the view with the data associated with the

307
00:28:15,200 --> 00:28:17,660
course.

308
00:28:17,810 --> 00:28:25,140
So let us try that and then we see here this is our details you very simple page and all it's doing

309
00:28:25,140 --> 00:28:33,270
is displaying the title and credits so it's details it's a view page it's it's for viewing purposes

310
00:28:33,300 --> 00:28:35,760
it's not for editing or creating.

311
00:28:35,760 --> 00:28:38,170
So this would be more like the are in crowed.

312
00:28:38,190 --> 00:28:40,700
This is your read page right.

313
00:28:40,810 --> 00:28:44,870
And we can choose to go back to the list which will just roll spark to the same place.

314
00:28:44,880 --> 00:28:49,990
This week we're also still or we can choose to go ahead and edit which would be the you.

315
00:28:50,210 --> 00:28:53,160
The update and then we do want to update this again.

316
00:28:53,160 --> 00:28:59,000
We can just go back to the list and then from here we can also delete.

317
00:28:59,920 --> 00:29:06,990
So if I click the would be led to something of a confirmation page which did a similar thing to the

318
00:29:06,990 --> 00:29:11,640
details it looked for the course and it brought about the course it's printing the details and then

319
00:29:11,640 --> 00:29:14,490
it's asking Are you sure or you want to delete this.

320
00:29:14,640 --> 00:29:23,960
And then just to add to the the aesthetics of the page I'll just go and find this delete view and then

321
00:29:24,710 --> 00:29:29,060
we can look through we can change the verbiage as we wish we can say okay delete.

322
00:29:29,060 --> 00:29:38,510
Are you sure you want to delete this and we can put this in an alert so we can give it a class and I'll

323
00:29:38,510 --> 00:29:43,570
give it an alert danger all right.

324
00:29:43,570 --> 00:29:49,000
So that's a bootstrap class alert danger bootstrap has excellent documentation I'll share that with

325
00:29:49,000 --> 00:29:57,670
you so you can if you're not so filled with bootstrap classes and what they do you can always go to

326
00:29:57,670 --> 00:30:02,290
the bootstrap get bootstrap outcome and they have excellent documentation where they go to all of their

327
00:30:02,290 --> 00:30:07,350
classes and there are functions for you.

328
00:30:07,360 --> 00:30:13,080
So I've made that change and then I refresh to see my changes.

329
00:30:13,110 --> 00:30:13,870
All right.

330
00:30:13,920 --> 00:30:18,930
That's not the best I think I'm using the class wrongly but you can see where the bootstrap class is

331
00:30:18,930 --> 00:30:25,290
helping me to just add a little individuality to the page as opposed to what was auto generated for

332
00:30:25,290 --> 00:30:28,450
me and I'd probably want the button to be read.

333
00:30:28,800 --> 00:30:36,640
So I was find that button and here is a button it's a submit button and I'll change that to meet to

334
00:30:36,640 --> 00:30:37,250
invest.

335
00:30:37,260 --> 00:30:37,860
Danger

336
00:30:41,180 --> 00:30:42,470
I believe for this one.

337
00:30:42,470 --> 00:30:45,440
I need to put alerts then alerts.

338
00:30:45,440 --> 00:30:49,610
So just do that save and refresh

339
00:30:52,980 --> 00:30:53,730
and there we go.

340
00:30:53,730 --> 00:30:55,460
So this looks much better.

341
00:30:55,500 --> 00:31:01,010
We see that alerts give it a bit more putting on an alert dangerous what made it red.

342
00:31:01,050 --> 00:31:06,600
All right so a lot of those bootstrap classes you have to use in peers but take your time and look through

343
00:31:06,600 --> 00:31:11,240
the examples and then our button is also right so delete.

344
00:31:11,300 --> 00:31:21,220
Just to show that our code works and what I'll do is also set a breakpoint in our courses.

345
00:31:21,400 --> 00:31:26,630
So we already loaded our get delete because we got the data.

346
00:31:27,130 --> 00:31:28,050
All right.

347
00:31:28,210 --> 00:31:30,940
So we've got the data for display purposes.

348
00:31:30,940 --> 00:31:35,210
That's what this one does know.

349
00:31:35,260 --> 00:31:37,230
When I click submit.

350
00:31:37,240 --> 00:31:39,970
As with any other page it needs to do something.

351
00:31:40,420 --> 00:31:46,840
So like I mentioned before each one has I get and I post editors I get and then it has a post.

352
00:31:47,200 --> 00:31:53,500
So you get is what happens when you burrows to the edit page but once you click submit the post is what

353
00:31:53,500 --> 00:31:54,130
happens.

354
00:31:54,220 --> 00:32:00,960
So we'll see in our delete post what happens now.

355
00:32:00,970 --> 00:32:02,310
The point is it.

356
00:32:02,350 --> 00:32:06,940
And then I will go ahead and click delete and then it hits the breakpoint.

357
00:32:06,940 --> 00:32:09,200
So here it pauses.

358
00:32:09,220 --> 00:32:17,890
We see that I.D. one it is not going to find the course and then visual studio 2017 allows us to do

359
00:32:17,890 --> 00:32:22,750
this cool thing where we just skip directly through a line somewhere to skip over this line.

360
00:32:24,510 --> 00:32:25,030
All right.

361
00:32:25,110 --> 00:32:28,020
That means a query was run.

362
00:32:28,020 --> 00:32:33,850
So if we look inside of course object we see that it got the course.

363
00:32:33,850 --> 00:32:34,780
That's the idea.

364
00:32:34,780 --> 00:32:44,650
Those are the credits and that is the title and then it's going to see remove from the table whatever

365
00:32:44,830 --> 00:32:46,510
data is in this object.

366
00:32:47,340 --> 00:32:47,710
All right.

367
00:32:48,100 --> 00:32:52,050
And then once that removal occurs we need to see changes.

368
00:32:52,090 --> 00:33:02,500
I'll just press F5 and at the end of all of this it is no going to redirect to our index action so you'll

369
00:33:02,500 --> 00:33:09,430
see that this is also one big pattern that happens in every single action in the edit action we see

370
00:33:09,430 --> 00:33:17,200
where it does some operation it validates that the data that has been put in since the edit is valid

371
00:33:17,650 --> 00:33:24,340
and then it does something where it attaches the fact that this entity was modified and it seems the

372
00:33:24,340 --> 00:33:25,420
changes.

373
00:33:25,420 --> 00:33:27,490
That's a nice quick way to do an edit.

374
00:33:27,850 --> 00:33:31,160
And then we return to the index.

375
00:33:31,270 --> 00:33:38,980
If we look at our create create is rendering the view well then it has a post where it is validating

376
00:33:39,100 --> 00:33:44,750
then adding seeing the change and then redirecting to index that is pretty much the flow of any code

377
00:33:44,770 --> 00:33:55,080
operation you context to only write code to effect whatever change to the database.

378
00:33:55,230 --> 00:34:01,010
You probably are creating content so you have to do that particularly maybe your editing Clinton's they

379
00:34:01,020 --> 00:34:05,370
have to find out what it is that you're editing and then lets you know it has been edited and then see

380
00:34:05,370 --> 00:34:06,310
if that changes.

381
00:34:06,420 --> 00:34:12,180
And then in this case we're deleting so we have to get the file are the record rather that we're deleting

382
00:34:12,600 --> 00:34:17,260
then seeing the changes and then we always go back home to the list.

383
00:34:17,520 --> 00:34:20,010
The list is what shows us that the changes have been made.

384
00:34:20,010 --> 00:34:26,760
So I'm just going to present five and skip ahead and then there we are we're redirected to index and

385
00:34:26,760 --> 00:34:28,830
we have an empty list.

386
00:34:29,340 --> 00:34:35,940
Now you can do that with any other data team that you have in your database that same procedure that

387
00:34:35,940 --> 00:34:42,930
you just did for courses obtains for students and it may be a bit different for enrolments.

388
00:34:42,930 --> 00:34:44,370
But I want to challenge you.

389
00:34:44,370 --> 00:34:51,450
Go ahead and do it for students and create the student code operations using the methods and techniques

390
00:34:51,480 --> 00:34:53,850
that you just learned in this video.

391
00:34:53,910 --> 00:34:59,310
Feel free to leave comments and let me know if you have any difficulty I'll be more than happy to assist

392
00:34:59,310 --> 00:34:59,520
you.

393
00:35:00,150 --> 00:35:02,040
Thanks again and have a good one.