How to conditionally render content in same page?

Question

I have a Home.xhtml page where there is signin form in a section. The user enters username and password and login to the page. I want to display the same page but removing the signin form but displaying "Welcome username" and a logout link. How can I do it using JSF 2.1?

Use a template where you will have a header and a body (or something alike). In the header, you will conditionally display a page with the login form or a page with the logged user info. — Luiggi Mendoza, Sep 08 '13 at 06:07

score 1 · Answer 1 · answered Sep 08 '13 at 16:21

You can use the "rendered" attribute to show or hide your elements. E.g.:

<h:componentContainingTheSignInForm rendered="#{not bean.signedIn}">
    signInForm...
</h:componentContainingTheSignInForm>

<h:componentToShowAfterSignIn rendered="#{bean.signedIn}">
    Welcome...
</h:componentToShowAfterSignIn>

score 0 · Answer 2 · answered Sep 08 '13 at 09:58

Here is my template:

<?xml version='1.0' encoding='UTF-8' ?>
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml"
          xmlns:h="http://java.sun.com/jsf/html"
          xmlns:f="http://java.sun.com/jsf/core"
          xmlns:ui="http://java.sun.com/jsf/facelets"
          >

        <h:head>
            <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
            <h:outputStylesheet name="default.css" library="css"></h:outputStylesheet>
            <title><ui:insert name="title" /></title>
        </h:head>

        <h:body>
<ui:insert name="body"></ui:insert>

        </h:body>
    </html>

And declare following statement in your Home.xhtml:

<?xml version="1.0" encoding="UTF-8"?>
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                template="/template/templatePage.xhtml">

    <ui:define name="title">
        Login
    </ui:define>

    <ui:define name="body">

Here is one better example.

Yes I understand about the use of templates, but how to display a certain template on a required condition. For example there is a sign in form and if the login is validated, a template with User link and logout link is to be displayed else, the former template with the sign in form is to be displayed. — Bibek Shelvey Gerrard Bhattara, Sep 08 '13 at 12:06
I now understand what you want to do. @BalusC has right with rendered way. You are only need to create one authorization bean (`@ManagedBean` or `@Named`) which first validate user name and code. One of possibility to manage this authorization is When the user name and code is Ok, the bean adjust your boolean field to true... — herry, Sep 09 '13 at 06:29

How to conditionally render content in same page?

2 Answers2