18.5 Conditionally Displaying the Results Table on a Search Page

When a web search form and results table are on the same page, the first time a user accesses the page, the table displays all records in the current range from the iterator. You can make it so that the results table does not display until the user actually executes the search. Figure 18-7 shows the SRSearch page as it displays the first time a user accesses it.

Figure 18-7 Hidden Results Table for a Search Page

The results table does not display in the SRSearch page

Once the user executes a search, the results table displays, as shown in Figure 18-8.

Figure 18-8 Results Table Displayed for a Search Page

The results table displays once a search is executed.

18.5.1 How to Add Conditional Display Capabilities

To conditionally display the results table, you must enter an EL expression on the UI component (either the table itself or another component that holds the table component), that evaluates to whether this is the first time the user has accessed the search page. A field on a managed bean holds the value used in the expression.

To conditionally display the results table:

Create a search form and results table on the same page.
Create a flag on a managed bean that will be set when the user accesses the page for the first time. For example, the userState managed bean in the SRDemo application contains the SEARCH_FIRSTTIME_FLAG parameter. An EL expression on the page needs to know the value of this parameter to determine whether or not to render the results table (see step 4). When the bean is instantiated for the EL expression, the isSearchFirstTime method then checks that field. If it is null, it sets the value to True. For information about creating managed beans, see Section 17.2, "Using a Managed Bean to Store Information"
On the JSF page, insert a setActionListener component into the command component used to execute this search. Set the from attribute to #{false}. Set the to attribute to the field on the managed bean created in step two. This will set that field to false whenever the button is clicked. For more information about using the setActionListener component, see Section 17.4, "Setting Parameter Values Using a Command Component".

Example 18-3 shows the code for the Search button on the SRSearch page.
Example 18-6 Using a setActionListener Component to Set a Value
```
<af:commandButton actionListener="#{bindings.Execute.execute}"
                 text="#{res['srsearch.searchLabel']}">
  <af:setActionListener from="#{false}"
                           to="#{userState.searchFirstTime}"/>
</af:commandButton>
```
On the JSF page, use an EL expression as the value of the Rendered attribute so that the UI component (the table or the UI component holding the table) only renders when the variable is a certain value.

Example 18-5 shows the EL expression used for the value for the Rendered attribute of the panelGroup component on the SRSearch page.
Example 18-7 JSF Code to Conditionally Display the Search Results Table
```
<af:panelGroup rendered="#{userState.searchFirstTime == false}">
```
This EL expression causes the panelGroup component to render only if the searchFirstTime flag has a value of False.

18.5.2 What Happens When you Conditionally Display the Results Table

When you use a managed bean to hold a value, other objects can both set the value and access the value. For example, similar to passing parameter values, you can use the setActionListener component to set values on a managed bean that can then be accessed by an EL expression on the rendered attribute of a component.

For example, when a user accesses the SRSearch page for the first time, the following happens:

Because the panelGroup component that holds the table contains an EL expression for it's rendered attribute, and the EL expression references the userState bean, that bean is instantiated.
Because the user has not accessed page, the SEARCH_FIRSTTIME_FLAG field on the userState bean has not yet been set, and therefore has a value of null
Because the value is null, the isSearchFirstTime method on that bean sets the SEARCH_FIRSTTIME_FLAG field to true.
When the EL expression for the panelGroup component is evaluated, because he SEARCH_FIRSTTIME_FLAG field is true, the SRSearch page displays without rendering the panelGroup component. This is because the EL expression for the Rendered attribute evaluates to True only when SEARCH_FIRSTTIME_FLAG field is false.
When the user enters search criteria and clicks the Search button, the associated setActionListener component sets the SEARCH_FIRSTTIME_FLAG field on the userState bean to false.
Because there is no outcome defined for the command button, the user stays on the same page.
Because the SEARCH_FIRSTTIME_FLAG field is now set to false, when the page rerenders with the results, the panelGroup component displays the table with the result.