WEBVTT 1 00:00:02.264 --> 00:00:03.823 Hey, welcome back. 2 00:00:03.823 --> 00:00:06.472 In this video, we're gonna cover part two 3 00:00:06.472 --> 00:00:09.222 of JSF forms and drop-down lists. 4 00:00:12.276 --> 00:00:13.683 What we're gonna do in this example 5 00:00:13.683 --> 00:00:14.848 is that we're gonna enhance 6 00:00:14.848 --> 00:00:16.913 the previous video example. 7 00:00:16.913 --> 00:00:19.042 Instead of having the drop-down list values 8 00:00:19.042 --> 00:00:21.313 hard coded in the JSF page, 9 00:00:21.313 --> 00:00:22.775 what we're gonna do instead is 10 00:00:22.775 --> 00:00:25.661 read the values from a managed bean. 11 00:00:25.661 --> 00:00:29.328 So, make the application a bit more dynamic. 12 00:00:31.508 --> 00:00:33.858 So let's go ahead and move into Eclipse. 13 00:00:33.858 --> 00:00:36.698 Again, we're gonna continue with the same project as before, 14 00:00:36.698 --> 00:00:38.499 Hello Project. 15 00:00:38.499 --> 00:00:41.984 I'm gonna edit the file studenttwo.java. 16 00:00:41.984 --> 00:00:45.235 So this is our managed bean from the previous video, 17 00:00:45.235 --> 00:00:46.677 and what I'm gonna do here is 18 00:00:46.677 --> 00:00:48.358 I'm gonna update the managed bean 19 00:00:48.358 --> 00:00:51.083 to contain a list of options. 20 00:00:51.083 --> 00:00:53.099 So this'll be the list of countries 21 00:00:53.099 --> 00:00:55.016 that a user can select. 22 00:00:56.582 --> 00:00:57.772 So I'll just do an import here 23 00:00:57.772 --> 00:00:59.272 for the type list. 24 00:01:03.823 --> 00:01:06.723 And so this is a list of our country options. 25 00:01:06.723 --> 00:01:08.274 Now, what we need to do next 26 00:01:08.274 --> 00:01:11.357 is populate this list with some data. 27 00:01:12.575 --> 00:01:14.992 So the first thing I'll do is I'll construct the list, 28 00:01:14.992 --> 00:01:16.923 inside of the constructor, 29 00:01:16.923 --> 00:01:20.410 so I'll say country options = new Array List, 30 00:01:20.410 --> 00:01:22.725 and then I'll go through and fix the import here 31 00:01:22.725 --> 00:01:24.135 for Array List. 32 00:01:24.135 --> 00:01:26.468 This is java.util.arraylist. 33 00:01:33.137 --> 00:01:34.852 And then I need to just drop in 34 00:01:34.852 --> 00:01:37.208 the list of options here. 35 00:01:37.208 --> 00:01:41.375 So I'm gonna drop in some code that I already have. 36 00:01:42.711 --> 00:01:45.502 And so, I have this array list of strings, 37 00:01:45.502 --> 00:01:48.339 and I'm gonna simply add in the various countries. 38 00:01:48.339 --> 00:01:51.839 Brazil, France, Germany, India, and so on. 39 00:01:55.924 --> 00:01:57.183 Now, the next thing I need to do 40 00:01:57.183 --> 00:01:59.554 is actually create a getter method 41 00:01:59.554 --> 00:02:02.304 for that list of country options. 42 00:02:04.134 --> 00:02:06.726 So, again, I'll make use of that Eclipse trick, 43 00:02:06.726 --> 00:02:08.550 where I'll do a right click, 44 00:02:08.550 --> 00:02:10.490 I'll choose source, 45 00:02:10.490 --> 00:02:14.407 I'll move down to generate getters and setters. 46 00:02:17.477 --> 00:02:19.253 And in the box here, 47 00:02:19.253 --> 00:02:22.744 I'll expand the list here for country options, 48 00:02:22.744 --> 00:02:25.923 and I'll select the option for get country options. 49 00:02:25.923 --> 00:02:27.567 I really only need a getter here, 50 00:02:27.567 --> 00:02:29.311 I don't need a setter. 51 00:02:29.311 --> 00:02:32.539 And then, as far as the placement of this getter, 52 00:02:32.539 --> 00:02:35.323 I'll place it right after the After Student Two, 53 00:02:35.323 --> 00:02:39.635 so right after the constructor for this class. 54 00:02:39.635 --> 00:02:41.895 That's the actual insertion point. 55 00:02:41.895 --> 00:02:43.812 And then I'll hit okay. 56 00:02:45.829 --> 00:02:48.412 And so, on lines 39 down to 41, 57 00:02:49.819 --> 00:02:52.776 this is the new code that Eclipse just entered for us. 58 00:02:52.776 --> 00:02:55.885 So it's a public getter method for country options, 59 00:02:55.885 --> 00:02:58.164 and it's gonna return the array list, 60 00:02:58.164 --> 00:03:00.098 I'm sorry, return the list of strings 61 00:03:00.098 --> 00:03:02.015 to the calling program. 62 00:03:03.536 --> 00:03:05.594 Alright, so this looks really good right now. 63 00:03:05.594 --> 00:03:08.349 I'll do some quick clean up here. 64 00:03:08.349 --> 00:03:11.288 And, great. So we're in really good shape right now 65 00:03:11.288 --> 00:03:14.538 with this addition to the managed bean. 66 00:03:17.919 --> 00:03:18.940 Well, the next thing I need to do 67 00:03:18.940 --> 00:03:20.738 is update my form. 68 00:03:20.738 --> 00:03:22.835 So I need to up down the drop-down list, 69 00:03:22.835 --> 00:03:25.174 so instead of having a hard code of values, 70 00:03:25.174 --> 00:03:27.774 I need to make use of that managed bean. 71 00:03:27.774 --> 00:03:29.604 So I'll move into the code that I had before, 72 00:03:29.604 --> 00:03:31.196 from the previous video, 73 00:03:31.196 --> 00:03:32.767 and I will simply 74 00:03:32.767 --> 00:03:35.795 select all of the code that was hard coded, 75 00:03:35.795 --> 00:03:39.962 and I'll actually remove it or delete it from this file. 76 00:03:41.810 --> 00:03:46.063 And instead what I'll do is I'll drop in some new code. 77 00:03:46.063 --> 00:03:48.526 So, right now, select one menu value, 78 00:03:48.526 --> 00:03:49.646 studenttwo.country, 79 00:03:49.646 --> 00:03:51.036 that's the same. 80 00:03:51.036 --> 00:03:52.455 This is the important line here. 81 00:03:52.455 --> 00:03:55.272 So here's select items, plural, 82 00:03:55.272 --> 00:03:58.428 and I have value, pound, curly brace, 83 00:03:58.428 --> 00:04:01.063 studenttwo.countryoptions. 84 00:04:01.063 --> 00:04:03.236 So, when this page is loaded, 85 00:04:03.236 --> 00:04:07.403 JSF will actually call studenttwo.getcountryoptions. 86 00:04:08.243 --> 00:04:10.004 So it's gonna return that list of strings 87 00:04:10.004 --> 00:04:11.845 that we've already defined 88 00:04:11.845 --> 00:04:14.796 inside of that managed bean class. 89 00:04:14.796 --> 00:04:16.816 So this is how we can get the list of options 90 00:04:16.816 --> 00:04:18.215 from the managed bean, 91 00:04:18.215 --> 00:04:21.965 as opposed to hard coding it in the JSF page. 92 00:04:25.239 --> 00:04:27.310 Now I just ran the application, 93 00:04:27.310 --> 00:04:29.054 and here's the output. 94 00:04:29.054 --> 00:04:32.636 So we have our first name, last name. 95 00:04:32.636 --> 00:04:35.264 So I'll enter Ajay Rao, again. 96 00:04:35.264 --> 00:04:36.297 And then for country. 97 00:04:36.297 --> 00:04:38.390 So now this country drop-down list 98 00:04:38.390 --> 00:04:40.042 is being populated by information 99 00:04:40.042 --> 00:04:42.430 from our managed bean. 100 00:04:42.430 --> 00:04:45.006 So it's no longer being hard coded in the JSF page, 101 00:04:45.006 --> 00:04:47.321 but that data's coming from our managed bean. 102 00:04:47.321 --> 00:04:49.917 I'm going to hit submit, 103 00:04:49.917 --> 00:04:53.167 and here we list the student's country, 104 00:04:54.139 --> 00:04:55.105 of India, 105 00:04:55.105 --> 00:04:56.893 networks out as desired. 106 00:04:56.893 --> 00:04:59.219 So in this part of it, nothing's really changed 107 00:04:59.219 --> 00:05:01.741 as far as the confirmation page. 108 00:05:01.741 --> 00:05:03.120 Alright, so this looks really good. 109 00:05:03.120 --> 00:05:03.953 Good job. 110 00:05:08.747 --> 00:05:11.218 Okay, so this wraps up the video. 111 00:05:11.218 --> 00:05:13.283 In this video we learned how to use JSF forms 112 00:05:13.283 --> 00:05:15.043 and drop-down lists. 113 00:05:15.043 --> 00:05:18.090 In particular, we enhanced our previous example 114 00:05:18.090 --> 00:05:21.311 to make use of managed themes for the form data. 115 00:05:21.311 --> 00:05:23.103 So instead of using the hard coded data 116 00:05:23.103 --> 00:05:24.375 in the JSF page, 117 00:05:24.375 --> 00:05:26.273 we actually have the data being pulled 118 00:05:26.273 --> 00:05:27.940 from a managed bean.