Posted by The following describe how to create a basic custom composite component in JSF 2.0+ for Primefaces. The method of using rendering classes, back beans, type classes, and others are not included in this tutorial. Please note that the IDE used for programming is NetBeans 7.4
- Create a Folder
Create a subfolder into the resources folder as show in the following image. In this case, we call this folder “utils”.
- Create a XHTML File
Inside the folder utils, lets cretae a XHTML file. This file will contain our custom composite component.
In this case, we call this file “displaySuperValue.xhtml” - File “displaySuperValue.xhtml” Content
Copy and Paste this code example:<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://xmlns.jcp.org/jsf/html" xmlns:composite="http://java.sun.com/jsf/composite"> <head><title>Show Super Value</title></head> <body> <composite:interface> <composite:attribute name="supervalue" required ="true" /> </composite:interface> <composite:implementation> <h
utputText value="This is SuPeR: #{cc.attrs.supervalue}" />
</composite:implementation>
</body>
</html> - About Your Custom Component
At the beginning of your file, you will need to include the composite namespace if the IDE did not include it automatically. Just add the following line:xmlns:composite=”http://java.sun.com/jsf/composite”
While the interface tag should hold all the attributes of your custom tag, the implementation tag should hold all your web interface script. In order use the attributes declared inside the interface tag, you need to use the “cc” bean provided by JSF. This bean is based on the UIComponent class.
- Implementing Your Custom Composite Component
Go to the XHTML file which you wish to use your custom composite component.
Start typing as you normally would do when writing a JSF tag by typing the name of the folder you created under the resources folder as show below:
While “utils” is the name of the folder, “displaySuperValue” is the name of the XHTML file you created.
As you keep typing, when using the space, the NetBeans IDE will display a list of all the default attributes including those you created inside the interface tag. Normally, the NetBeans IDE should include the namespace that will allow you to access to your custom component; however, if the IDE doesn’t include the namespace, just add the following namespace and the problem should be solved:xmlns:utils="http://xmlns.jcp.org/jsf/composite/utils"
© 2014, Alejandro G. Carlstein Ramos Mejia. All rights reserved.
