®
IBM Software Group
Programmatically Rendering and Hiding JSF Controls
This section describes how to hide and show JSF controls programmatically, using
EGL server-side logic.
© 2006 IBM Corporation
Programmatically Rendering Controls Visible/Invisible
An extremely common requirement for production applications is to be able to
render certain controls visible in the browser (or not) based on some programmatic
condition.
 This is very easy to do with RBDe/EGL – as with EGL and dynamic JSF controls –
you can set properties that either render or do not render the controls at the server
(before creating the HTML stream sent to the browser).
 Here’s how:
Add a boolean variable to your JSFHandler
Value the variable programmatically (based on your business logic):
 False – to hide controls
 True – to show controls
Bind the boolean variable to control’s “rendered” property
 You may use this technique to render/not-render any JSF component
 Input field, button, combo-box, etc
 A dataTable
 A column within a dataTable
 Let’s see how it works 
Last update: 12/04/2007
2
 Rendering Controls Lab 1 of 3 – Create the Page and JSFHandler
 Create a new page, named: controlVisibility.jsp – use a page template
 Add an HTML table to the page: 3 Rows/2 Columns. Width 100%
 Add the static text and JSF components as shown below in the screen capture
 NOTE:
 An input field/submit button
 A Record – inside of a JSF Group box
 A dataTable
 Copy/Paste the EGL from the Notes section of the slide, and replace the default JSFHandler
with this code
Last update: 12/04/2007
3
 Rendering Controls Lab 2 of 3 – Add the EGL Variables to the Page
 From Page Data:
 Drag and drop ordersRec into the top row – it will create a vertical set of fields and literals
 Make the fields output controls, and do not add OrderAmount to the page
 From Enhanced Faces Components, drag and drop a Panel – Group Box
 You will be prompted for a type. Select Type: JSP
 Drag and drop ordersRec into the Group Box
 Make the fields output controls, and do not add OrderAmount to the page
 Drag and drop the orders array into the 3rd row – where it will create a dataTable
 Make the fields output controls, and do not add OrderAmount to the page
 Drag and Drop the two functions on to the page – where the will create Submit Buttons
Last update: 12/04/2007
4
 Rendering Controls Lab 3 of 3 – Render the Controls (Visible/Invisible)

Do the following to render controls for fields (and to render specific dataTable columns):
1. Select the JSF control
2. From Properties / All Attributes – open the ComboBox on the right hand side of the rendered value.
3. Choose Compute, and from Page Data, choose the appropriate EGL visibility variable
 Use the above steps to bind the visibility variables to:
 In the top row, the OrderID control
 In the middle row, the entire JSP Group Box – Note that in order to select the JSP Group Box:


Select the entire HTML table for the Record
Click the Left  arrow key on your PC
 In the bottom row, the OrderID column of the dataTable
 Run the page on the server, and click the submit buttons to see cause and effect
 Note that initially the OrderID control, column and the entire Group Box is NOT displayed. This is
because an EGL boolean variable is initialized by default to false.
Last update: 12/04/2007
5