Seam-gen generates a standard login page that we can personalize. It is called login.xhtml
and you can find it in the /view/
path. It uses the JBoss Seam authentication features, so we will extend it to include our login support code. Also, it uses the template.xhtml
page that we have already seen.
Let's see the code:
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:s="http://jboss.com/products/seam/taglib" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html" xmlns:rich="http://richfaces.org/rich" template="layout/template.xhtml"> <ui:define name="body"> <h:form id="login"> <rich:panel> <f:facet name="header">Login</f:facet> <p>Please login here</p> <div class="dialog"> <h:panelGrid columns="2" rowClasses="prop" columnClasses="name,value"> <h:outputLabel for="username"> Username </h:outputLabel> <h:inputText id="username" value="#{credentials.username}"/> <h:outputLabel for="password"> Password </h:outputLabel> <h:inputSecret id="password" value="#{credentials.password}"/> <h:outputLabel for="rememberMe"> Remember me </h:outputLabel> <h:selectBooleanCheckbox id="rememberMe" value="#{identity.rememberMe}"/> </h:panelGrid> </div> <p> <i>Note - </i> You may login with the username 'admin' and a blank password. </p> </rich:panel> <div class="actionButtons"> <h:commandButton value="Login" action="#{identity.login}"/> </div> </h:form> </ui:define> </ui:composition>
Again, we see DOCTYPE
and the Facelets ui:composition
component that wraps content to be included in another Facelet. As you can see, in fact, after the xmlns
declarations, there is the template
attribute that points to the template.xhtml
page we have seen and uses it as a template.
Remember the body insertion point in template.xhtml?
How do we insert code at that point?
The answer is simple just use the<ui:define>
tag and set the name
attribute as one of the insertion points:
<ui:define name="body"> <! - this code will be inserted --> </ui:define>
We can find it in our login.xhtml
page. It includes the personalized part of the login.xhtml
page, that is the one with the login form.
We can see the code to declare<h:form>
and the<rich:panel>
component inside it. It contains the inputs for username and password (and a Remember me checkbox). Below the panel, there is the standard JSF h:commandButton
that calls the login action. We don't want an Ajax login, so it's okay to use a standard action component that will redirect to the home page after the login is complete.
All of those components point to a special Seam component called identity, which manages the login phase.
We are not going to edit this page a lot, the only thing we will do is delete the Note
section, as we don't need it:
<p> <i>Note - </i> You may login with the username 'admin' and a blank password. </p>
3.139.103.204