WEBVTT

1
00:00:01.871 --> 00:00:03.675
<v ->Alright, so let's go ahead and start up.</v>

2
00:00:03.675 --> 00:00:04.936
So the first thing I want

3
00:00:04.936 --> 00:00:08.272
to do here is close the previous project.

4
00:00:08.272 --> 00:00:10.808
So I'll go ahead and select project v2.

5
00:00:10.808 --> 00:00:14.891
Just do a right click and I'll say close project.

6
00:00:17.828 --> 00:00:19.878
Alright so that closes v2.

7
00:00:19.878 --> 00:00:22.161
Now what I want to do is open up v3.

8
00:00:22.161 --> 00:00:24.838
Which has the update student information.

9
00:00:24.838 --> 00:00:26.588
So I'll do an import.

10
00:00:27.553 --> 00:00:29.089
I'm gonna go up to the Generals.

11
00:00:29.089 --> 00:00:31.657
Select existing projects into work space.

12
00:00:31.657 --> 00:00:32.990
I click on next.

13
00:00:35.882 --> 00:00:37.172
And I'll browse over

14
00:00:37.172 --> 00:00:39.543
to where I have the jdbc-source-code downloaded.

15
00:00:39.543 --> 00:00:40.876
So I know it's jsf-for-beginners.

16
00:00:40.876 --> 00:00:42.626
I have jdbc-source-code.

17
00:00:42.626 --> 00:00:43.776
That's the same directory

18
00:00:43.776 --> 00:00:45.762
that we used in the previous video.

19
00:00:45.762 --> 00:00:49.679
Here I want to choose version-3-update-student.

20
00:00:52.014 --> 00:00:54.764 line:15% 
And I'll go ahead and click open.

21
00:00:55.767 --> 00:00:57.807 line:15% 
OK, great so it's going to list the projects.

22
00:00:57.807 --> 00:01:00.592 line:15% 
So you should see a jdbc-student-tracker-v3.

23
00:01:00.592 --> 00:01:02.438 line:15% 
That's the correct project that you want

24
00:01:02.438 --> 00:01:05.065 line:15% 
to have open for this import.

25
00:01:05.065 --> 00:01:07.800 line:15% 
And when you're back click on finish.

26
00:01:07.800 --> 00:01:09.094 line:15% 
Alright great, so on the left hand side

27
00:01:09.094 --> 00:01:12.416 line:15% 
we have this new entry here jdbc-student-tracker-v3.

28
00:01:12.416 --> 00:01:14.252 line:15% 
So this is the one for update student,

29
00:01:14.252 --> 00:01:17.631
and this is the one we'll use in this video.

30
00:01:17.631 --> 00:01:19.472
Alright, so lets go ahead and take a look

31
00:01:19.472 --> 00:01:23.349
at our source code here, actually our JSF files.

32
00:01:23.349 --> 00:01:25.555
And I'm going to go into the web content directory.

33
00:01:25.555 --> 00:01:28.722
And take a look a list-students.xhtml.

34
00:01:31.511 --> 00:01:33.957
So this is the same file that we had before.

35
00:01:33.957 --> 00:01:36.524
This is where we will list out all of the students.

36
00:01:36.524 --> 00:01:39.236
On lines 6 through 8 we actually load the students.

37
00:01:39.236 --> 00:01:41.236
So we can list them out.

38
00:01:43.674 --> 00:01:45.774
And we have this button for adding students.

39
00:01:45.774 --> 00:01:48.441
We saw that in a previous video.

40
00:01:50.315 --> 00:01:52.593
And now we have our table that shows all

41
00:01:52.593 --> 00:01:54.926
of our students to the user.

42
00:01:56.321 --> 00:01:58.816
So now we're gonna keep all the same columns.

43
00:01:58.816 --> 00:02:02.393
And we're gonna add this new column here called action.

44
00:02:02.393 --> 00:02:04.560
So on lines 67 through 75.

45
00:02:06.455 --> 00:02:09.087
This is our new action column.

46
00:02:09.087 --> 00:02:12.962
So we'll have the actual column name, action.

47
00:02:12.962 --> 00:02:14.709
And then we'll actually have a link.

48
00:02:14.709 --> 00:02:18.717 line:15% 
So for each student, we're gonna have an update link.

49
00:02:18.717 --> 00:02:21.820 line:15% 
And the action will call the studentController loadStudent.

50
00:02:21.820 --> 00:02:24.700 line:15% 
And will pass on that's student's unique ID.

51
00:02:24.700 --> 00:02:26.794 line:15% 
So remember we're looping through all the students.

52
00:02:26.794 --> 00:02:29.328 line:15% 
And we're putting them in the list or table.

53
00:02:29.328 --> 00:02:32.802 line:15% 
So each link will have that unique student's ID.

54
00:02:32.802 --> 00:02:35.615 line:15% 
So we'll make a call to studentController dot loadStudent.

55
00:02:35.615 --> 00:02:37.404 line:15% 
And we'll pass on that student's ID.

56
00:02:37.404 --> 00:02:41.237 line:15% 
And I'll show the coding for that in a second.

57
00:02:43.264 --> 00:02:46.901
Alright, so lets go ahead and look at our StudentController.

58
00:02:46.901 --> 00:02:48.999
So I'll move over to my source code directory.

59
00:02:48.999 --> 00:02:53.166
Java Resources, source, package, StudentController dot java.

60
00:02:58.120 --> 00:03:00.616
And so remember our controllers are ManagedBean.

61
00:03:00.616 --> 00:03:02.495
We have it setup as SessionScoped.

62
00:03:02.495 --> 00:03:04.888
So this is our StudentController.

63
00:03:04.888 --> 00:03:06.703
And what I want to do is go look at a method here.

64
00:03:06.703 --> 00:03:08.622
So we have a lot of methods in this class now.

65
00:03:08.622 --> 00:03:11.960
I make use of using clips trick called Quick Outline.

66
00:03:11.960 --> 00:03:13.385
And what Quick Outline will do.

67
00:03:13.385 --> 00:03:17.217
It will show you a list of all the methods in your class.

68
00:03:17.217 --> 00:03:18.959
And so it allows you to easily navigate

69
00:03:18.959 --> 00:03:19.882
to one of those methods.

70
00:03:19.882 --> 00:03:23.784
So I'll look at this method called loadStudent.

71
00:03:23.784 --> 00:03:28.110
And that's the version that takes an integer ID.

72
00:03:28.110 --> 00:03:30.891
So I'll go ahead and select this method loadStudent.

73
00:03:30.891 --> 00:03:32.291
Singular.

74
00:03:32.291 --> 00:03:34.520
So on line 75 here's loadStudent.

75
00:03:34.520 --> 00:03:36.516
It takes a parameter and studentID.

76
00:03:36.516 --> 00:03:38.306
What this method will do is it'll actually go

77
00:03:38.306 --> 00:03:39.947
to the database grab a student put it in memory

78
00:03:39.947 --> 00:03:43.780
and make it available for the other JSF pages.

79
00:03:45.024 --> 00:03:47.402
So on lines 80, 81 I might actually use my

80
00:03:47.402 --> 00:03:50.000
studentDbUtil and say getStudent and I pass

81
00:03:50.000 --> 00:03:51.776
in that student ID.

82
00:03:51.776 --> 00:03:54.004
It'll return a student object that it read

83
00:03:54.004 --> 00:03:55.504
from the database.

84
00:03:59.008 --> 00:04:01.379
Now what I need to do is take this and put it into memory.

85
00:04:01.379 --> 00:04:04.476
So I need to make use of one of these helper classes here.

86
00:04:04.476 --> 00:04:07.892
Called FacesContext, so actually my external context.

87
00:04:07.892 --> 00:04:09.960
So this is really a area of memory

88
00:04:09.960 --> 00:04:12.556
that I can use for storing data.

89
00:04:12.556 --> 00:04:14.407
So I get a handle of to those external context

90
00:04:14.407 --> 00:04:15.366
by saying

91
00:04:15.366 --> 00:04:19.401
FacesContext, getCurrentInstance, getExternalContext.

92
00:04:19.401 --> 00:04:22.055
So again just a helper class for getting access to some

93
00:04:22.055 --> 00:04:23.722
of the servlet data.

94
00:04:26.336 --> 00:04:28.037
OK great so I have this externalContext

95
00:04:28.037 --> 00:04:29.546
a little helper class I can use

96
00:04:29.546 --> 00:04:30.870
to get access to servlet data.

97
00:04:30.870 --> 00:04:34.181
So here I'll say externalContext getRequestMap.

98
00:04:34.181 --> 00:04:36.959
This is going to get me a map or hash map

99
00:04:36.959 --> 00:04:38.591
of request attributes.

100
00:04:38.591 --> 00:04:41.183
So effectively what I can do is add additional data

101
00:04:41.183 --> 00:04:42.894
to this web request.

102
00:04:42.894 --> 00:04:46.460
So I can say requestMap dot put student comma theStudent.

103
00:04:46.460 --> 00:04:49.018
So in quotes I have the student.

104
00:04:49.018 --> 00:04:52.548
That's the actual label or name we'll use for this object.

105
00:04:52.548 --> 00:04:55.219
And then theStudent is an actual reference to the object.

106
00:04:55.219 --> 00:04:57.857
So think of it as adding a foreign parameter.

107
00:04:57.857 --> 00:05:01.920
But instead we're adding a request attribute.

108
00:05:01.920 --> 00:05:03.409
So once we put the data there.

109
00:05:03.409 --> 00:05:06.282
Then we forward it over to our update-student-form.

110
00:05:06.282 --> 00:05:08.548
Our form will actually read the student object

111
00:05:08.548 --> 00:05:11.273
that we have in memory and pre-populate the form.

112
00:05:11.273 --> 00:05:13.214
So that's basically how we have

113
00:05:13.214 --> 00:05:14.965
to do some behind the scenes work.

114
00:05:14.965 --> 00:05:16.137
Grabbing the object.

115
00:05:16.137 --> 00:05:17.427
Putting it into the requestMap.

116
00:05:17.427 --> 00:05:20.542
And then we'll send it over to the update-student-form.

117
00:05:20.542 --> 00:05:24.542
So they can view it or show it, pre-populate it.

118
00:05:31.000 --> 00:05:34.417
Alright so lets go look at studentDbUtil.

119
00:05:35.444 --> 00:05:38.444
So StudentDbUtil and it has a method

120
00:05:40.647 --> 00:05:45.419
in here called getStudent based on a given student ID.

121
00:05:45.419 --> 00:05:49.002
So we'll go ahead and click on this method.

122
00:05:50.455 --> 00:05:52.329
So this is where we'll do the database work.

123
00:05:52.329 --> 00:05:54.213
So our normal database method is here.

124
00:05:54.213 --> 00:05:56.995
Line 114 we get a connection to the database.

125
00:05:56.995 --> 00:05:58.805
We setup our sql query select star

126
00:05:58.805 --> 00:06:01.734
from student where id equals question mark.

127
00:06:01.734 --> 00:06:03.210
And we'll gonna fill in that question mark.

128
00:06:03.210 --> 00:06:07.209
Based on the parameters being sent into this method.

129
00:06:07.209 --> 00:06:09.167
So I prepare the statement.

130
00:06:09.167 --> 00:06:13.368
Then I say myStmt dot setInt one comma studentId.

131
00:06:13.368 --> 00:06:17.103
So that will set the value accordingly.

132
00:06:17.103 --> 00:06:18.593
And I'll go through and execute the query.

133
00:06:18.593 --> 00:06:20.664
So I'll say myStmt dot executeQuery.

134
00:06:20.664 --> 00:06:23.247
It'll return back a result set.

135
00:06:24.857 --> 00:06:27.148
So now this should be for one student here.

136
00:06:27.148 --> 00:06:30.374
So I'll say move forward mRs dot next.

137
00:06:30.374 --> 00:06:32.768
And I'll just grab the information off that result set.

138
00:06:32.768 --> 00:06:34.967
So I grab the student's ID, first name, last name,

139
00:06:34.967 --> 00:06:36.543
and email address.

140
00:06:36.543 --> 00:06:39.475
So I'm grabbing that information from the database.

141
00:06:39.475 --> 00:06:43.642
And I can use that to create a new student object.

142
00:06:45.506 --> 00:06:49.089
And then finally I just return the student.

143
00:06:52.020 --> 00:06:54.624
OK great so that's kind of how the low level stuff works.

144
00:06:54.624 --> 00:06:58.982
As far as getting the student from the database.

145
00:06:58.982 --> 00:07:01.398
Then we put it in our memory and then we send it

146
00:07:01.398 --> 00:07:04.753
over to that update-student-form.xhtml.

147
00:07:04.753 --> 00:07:06.203
Alright, so lets go look at that form

148
00:07:06.203 --> 00:07:08.120
and see how that works.

149
00:07:09.606 --> 00:07:13.023
So I'm in this update-student-form.xhtml.

150
00:07:16.488 --> 00:07:18.434
So this is the update form.

151
00:07:18.434 --> 00:07:20.094
It's very similar to the add form.

152
00:07:20.094 --> 00:07:24.261
I just copied it and made a small modification to it.

153
00:07:25.424 --> 00:07:27.591
So here's my form line 30.

154
00:07:29.230 --> 00:07:31.297
And again it's very similar to what we saw before.

155
00:07:31.297 --> 00:07:33.887
So we have our label for first name.

156
00:07:33.887 --> 00:07:37.948
And then we have an input text for first name.

157
00:07:37.948 --> 00:07:41.041
Now remember JSF when they first load a form.

158
00:07:41.041 --> 00:07:44.161
Then they'll actually call the getter methods on the beans.

159
00:07:44.161 --> 00:07:45.991
So since we have this student object

160
00:07:45.991 --> 00:07:48.147
that's already been created and populated in memory

161
00:07:48.147 --> 00:07:49.727
in that request map.

162
00:07:49.727 --> 00:07:51.941
Then it'll call that same method.

163
00:07:51.941 --> 00:07:53.463
It'll use that same object.

164
00:07:53.463 --> 00:07:56.761
And it'll call the get first name, get last name.

165
00:07:56.761 --> 00:07:59.276
So again JSF will call the getter methods

166
00:07:59.276 --> 00:08:02.776
when it first displays a page using beans.

167
00:08:03.808 --> 00:08:06.928
So that's basically how we handle the pre-populating

168
00:08:06.928 --> 00:08:08.011
of this form.

169
00:08:14.702 --> 00:08:17.974
Alright so lets go ahead and look at our save button.

170
00:08:17.974 --> 00:08:20.655
So when they press save we want to update the student.

171
00:08:20.655 --> 00:08:24.354
So on line 43 and 44 we have our save button.

172
00:08:24.354 --> 00:08:26.775
So the label is save that's the value.

173
00:08:26.775 --> 00:08:29.123
And the action is the method that we'll actually call

174
00:08:29.123 --> 00:08:31.817
when we hit the save button.

175
00:08:31.817 --> 00:08:34.981
So here I'll call studentController.updateStudent

176
00:08:34.981 --> 00:08:37.411
and I'll pass in a reference to that student object.

177
00:08:37.411 --> 00:08:39.934
So again the same student object that we have

178
00:08:39.934 --> 00:08:42.089
on this form any modifications that they've made.

179
00:08:42.089 --> 00:08:43.575
Then we'll make a call there.

180
00:08:43.575 --> 00:08:45.384
And so again when you save.

181
00:08:45.384 --> 00:08:47.612
They'll call the setter methods on that bean.

182
00:08:47.612 --> 00:08:50.321
And then again pass it into the controller accordingly.

183
00:08:50.321 --> 00:08:52.996
So any new data that the user entered will be stored

184
00:08:52.996 --> 00:08:57.163
in that student object as we pass it over for that call.

185
00:08:59.639 --> 00:09:01.479
Alright so lets go look at the StudentController

186
00:09:01.479 --> 00:09:02.979
for updateStudent.

187
00:09:04.073 --> 00:09:09.019
So we're moving back into our managed bean StudentController

188
00:09:09.019 --> 00:09:11.211
There's a method here called updateStudent.

189
00:09:11.211 --> 00:09:12.676
They pass in a student object.

190
00:09:12.676 --> 00:09:14.929
This is passing from that JSF form.

191
00:09:14.929 --> 00:09:16.797
And what we're do is simply delegate this call

192
00:09:16.797 --> 00:09:20.284
off to our helper again studentDbUtil.updateStudent.

193
00:09:20.284 --> 00:09:21.825
And we'll pass in a reference.

194
00:09:21.825 --> 00:09:22.959
And once that's complete.

195
00:09:22.959 --> 00:09:26.626
We simply return a list of all our students.

196
00:09:27.531 --> 00:09:30.943
So lets go ahead and dig into this studentDbUtil.

197
00:09:30.943 --> 00:09:34.017
And look at the coding for it.

198
00:09:34.017 --> 00:09:36.719
So back over here studentDbUtil.

199
00:09:36.719 --> 00:09:40.302
There's a method here called updateStudent.

200
00:09:43.067 --> 00:09:43.900
So we'll bring that up.

201
00:09:43.900 --> 00:09:45.284
So right now I'm in a different class here.

202
00:09:45.284 --> 00:09:48.042
I'm in the StudentDbUtil class.

203
00:09:48.042 --> 00:09:49.057
And here's our update student method.

204
00:09:49.057 --> 00:09:51.469
And this is where we do all the jdbc work.

205
00:09:51.469 --> 00:09:53.803
So again we get a connection to the database.

206
00:09:53.803 --> 00:09:55.049
We setup our string.

207
00:09:55.049 --> 00:09:56.277
We're gonna update student.

208
00:09:56.277 --> 00:09:58.866
We're gonna set first name, last name, email.

209
00:09:58.866 --> 00:10:01.033
Where a certain ID is set.

210
00:10:02.428 --> 00:10:04.206
So where ID equals question mark.

211
00:10:04.206 --> 00:10:06.027
This is going to be based on that parameter.

212
00:10:06.027 --> 00:10:09.110
That's being passed into this method.

213
00:10:12.056 --> 00:10:14.145
So again we prepare the statement.

214
00:10:14.145 --> 00:10:15.266
And then we dot the real work here.

215
00:10:15.266 --> 00:10:16.794 line:15% 
We set the parameters.

216
00:10:16.794 --> 00:10:19.136 line:15% 
So we set parameters one, two , three, four,

217
00:10:19.136 --> 00:10:23.303 line:15% 
first name, last name, email, and ID respectively.

218
00:10:26.371 --> 00:10:27.937 line:15% 
And then finally we execute the statement.

219
00:10:27.937 --> 00:10:30.034 line:15% 
So that performs the update in the database.

220
00:10:30.034 --> 00:10:32.534 line:15% 
And so we're good to go there.

221
00:10:35.673 --> 00:10:37.458 line:15% 
So that's basically all the database work there

222
00:10:37.458 --> 00:10:40.208 line:15% 
for doing an update on a student.

223
00:10:43.551 --> 00:10:45.483
Alright so lets go down and run the application.

224
00:10:45.483 --> 00:10:47.756
So I'll go to my list-students.xhtml.

225
00:10:47.756 --> 00:10:51.839
I'll just do a Run As and I'll say Run on Server.

226
00:10:54.246 --> 00:10:56.772
Alright so here's my app in the browser inside of Eclipse.

227
00:10:56.772 --> 00:10:58.502
I'll just copy this url.

228
00:10:58.502 --> 00:11:02.085
I'll just right click and I'll select copy.

229
00:11:05.947 --> 00:11:07.767
And I'll move over to my real browser

230
00:11:07.767 --> 00:11:09.850
and drop it in and paste.

231
00:11:10.977 --> 00:11:13.470
And now I'll take a look at the application.

232
00:11:13.470 --> 00:11:14.411
So here's the app.

233
00:11:14.411 --> 00:11:17.177
I can go through and select one of these users here

234
00:11:17.177 --> 00:11:19.016
and perform an update on them.

235
00:11:19.016 --> 00:11:20.360
So I'll perform and update

236
00:11:20.360 --> 00:11:23.225
on the first user here Maxwell Dixon.

237
00:11:23.225 --> 00:11:26.675
So I'll go through and I'll change his last name to Zeno.

238
00:11:26.675 --> 00:11:28.975
Just making things up here, having fun.

239
00:11:28.975 --> 00:11:33.142
And I will also update his email maxzeno@luv2code.com.

240
00:11:36.040 --> 00:11:39.395
Alright great so once we save this user.

241
00:11:39.395 --> 00:11:40.866
Then we can go look at the update here.

242
00:11:40.866 --> 00:11:41.975
So here on our list.

243
00:11:41.975 --> 00:11:43.908
Notice at the bottom Maxwell Zeno.

244
00:11:43.908 --> 00:11:46.531
Again he's last because we're sorting by last name

245
00:11:46.531 --> 00:11:48.285
and Z's last there.

246
00:11:48.285 --> 00:11:51.535
His updated email address maxzeno@luv2code.com.

247
00:11:51.535 --> 00:11:52.604
So this works great.

248
00:11:52.604 --> 00:11:55.035
So our data is actually being updated and stored

249
00:11:55.035 --> 00:11:56.613
in the database accordingly.

250
00:11:56.613 --> 00:11:58.613
So good job, good stuff.

251
00:11:59.912 --> 00:12:02.344
Alright so one thing that I want to do is go through

252
00:12:02.344 --> 00:12:04.843
and verify this in the real database in the background.

253
00:12:04.843 --> 00:12:07.194
Right, cause again, kind of like the previous video.

254
00:12:07.194 --> 00:12:08.155
We didn't really trust it.

255
00:12:08.155 --> 00:12:09.880
So lets go ahead and start up MySQLWorkBench.

256
00:12:09.880 --> 00:12:13.918
And we'll take a look at this code or this data

257
00:12:13.918 --> 00:12:15.418
in the background.

258
00:12:17.182 --> 00:12:19.971
Alright so here's our system here, up and running.

259
00:12:19.971 --> 00:12:22.420
Lets go ahead and look at student_tracker.

260
00:12:22.420 --> 00:12:25.319
Go into our tables and look at the student table.

261
00:12:25.319 --> 00:12:29.172
And then again we'll just do a right click on this table.

262
00:12:29.172 --> 00:12:31.339
And we'll say Select Rows.

263
00:12:33.695 --> 00:12:35.324
And then we'll see the output.

264
00:12:35.324 --> 00:12:37.331
So a couple of things here.

265
00:12:37.331 --> 00:12:40.245
So one see that Maxwell Zeno that was updated accordingly.

266
00:12:40.245 --> 00:12:41.245
That's good.

267
00:12:42.481 --> 00:12:46.299
And we also see this from the previous demo earlier

268
00:12:46.299 --> 00:12:49.506
of Lisa Mangano, funnylisa@gmail.com.

269
00:12:49.506 --> 00:12:52.382
We can kind of feel rest assured here

270
00:12:52.382 --> 00:12:54.679
that things are working right as expected.

271
00:12:54.679 --> 00:12:58.561
And we are actually updating information in the database.

272
00:12:58.561 --> 00:13:01.394
So, ah sigh of relief, so good job

273
00:13:04.934 --> 00:13:06.546
So in summary here we took a look

274
00:13:06.546 --> 00:13:07.892
at a demo of the application.

275
00:13:07.892 --> 00:13:10.100
We also saw the Big Picture.

276
00:13:10.100 --> 00:13:11.446
The Sequence Diagram and then we

277
00:13:11.446 --> 00:13:13.093
also went through a Code Walk Through.

278
00:13:13.093 --> 00:13:14.599
So we saw all the code required

279
00:13:14.599 --> 00:13:18.804
for actually updating a student in the database using JSF.

280
00:13:18.804 --> 00:13:19.637
Good job.