getCelebrityById(Integer.parseInt(str)); } } ??? ??? Creating Custom Components [ 210 ] You see that we are passing a data source as a parameter to this class' constructor. A celebrity's ID is stored in the value attribute, corresponding to its option, and when the form is submitted, that ID is used to retrieve the celebrity from the data source. We have created three classes to tell the Select component how to deal with our custom class, but all the implementations were extremely simple, and we can reuse these classes whenever we want to select one of the celebrities in our application. Let's see how all this works together. Selecting a Celebrity Let's create a control that will allow us to use one of the available celebrities and provide a way to display exactly which celebrity was selected. I don't know what it will be used for, but it might certainly become valuable as we continue to develop the Celebrity Collector application. The control can be placed on any page for now, let it be ShowAll for example, and the end result might look like this: And here is how this will look in the page template: t:value="selectedCelebrity" t:encoder="celebrityEncoder"/>
Selected Celebrity: ${selectedCelebrityName}
You can see that the Select component has three parameters, in this case, celebrityModel, selectedCelebrity and celebrityEncoder.