JavaBeat

  • Home
  • Java
    • Java 7
    • Java 8
    • Java EE
    • Servlets
  • Spring Framework
    • Spring Tutorials
    • Spring 4 Tutorials
    • Spring Boot
  • JSF Tutorials
  • Most Popular
    • Binary Search Tree Traversal
    • Spring Batch Tutorial
    • AngularJS + Spring MVC
    • Spring Data JPA Tutorial
    • Packaging and Deploying Node.js
  • About Us
    • Join Us (JBC)
  • Privacy

JSF 2 UI Debug Example

April 5, 2014 by Amr Mohammed Leave a Comment

When you place the ui:debug tag in a Facelets page, a debug component is added to the component tree for that tag. If the user types a hotkey, which by default is CTRL+SHIFT+d, JSF opens a window and display the state of the component tree and the application’s scoped variables.

You can click on the Component Tree or Scoped Variables, to show the component tree or the application’s scoped variables, respectively. The ui:debug tag also lets you redefine the hotkey that bring up the Debug Output window, with a hotkey attribute.

The ui:debug component is very useful during the development, so developers can instantly see the current page’s component tree and the application’s scoped variables; however, you will probably want to remove the tag in production. For that reason, we recommend that you put the ui:debug tag in a template, where is is specified in one place, and shared among many views, instead of replacing the tag in each view’s XHTML page.

Also Read:

  • JSF 2 Tutorials
  • JSF Tutorials
  • Introduction to JSF

1. Managed Bean

IndexBean.java

[code lang=”java”]
package net.javabeat.jsf.data;

import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;

@ManagedBean
@SessionScoped
public class IndexBean {
private String message = "JavaBeat UI Debug Example";

public String getMessage() {
return message;
}

public void setMessage(String message) {
this.message = message;
}
}
[/code]

2. The Template

JavaBeatTemplate.xhtml

[code lang=”xml”]
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core">
<h:head>
<h:outputScript library="javax.faces" name="jsf.js"/>
</h:head>
<h:body>
<ui:insert name="body"/>
<!– The letter e is used, cause the CTRL+SHIFT+d is reserved for chrome browser –>
<ui:debug hotkey="e"/>
</h:body>
</html>
[/code]

3. The View

index.xhtml

[code lang=”xml”]
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core">
<h:head>
<h:outputScript library="javax.faces" name="jsf.js"/>
</h:head>
<h:body>
<ui:composition template="/template/JavaBeatTemplate.xhtml">
<ui:define name="body">
<h:outputText value="#{indexBean.message}"/>
</ui:define>
</ui:composition>
</h:body>
</html>
[/code]

4. JSF 2 UI Debug Demo

The below snapshot shows you how could you debugging your view through using of ui:debug.

JSF 2 UI Debug Example 1

JSF 2 UI Debug Example 2

JSF 2 UI Debug Example 3

JSF 2 UI Debug Example 4

[wpdm_file id=45]

Filed Under: JSF Tagged With: JSF 2

About Amr Mohammed

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Follow Us

  • Facebook
  • Pinterest

As a participant in the Amazon Services LLC Associates Program, this site may earn from qualifying purchases. We may also earn commissions on purchases from other retail websites.

JavaBeat

FEATURED TUTORIALS

Answered: Using Java to Convert Int to String

What is new in Java 6.0 Collections API?

The Java 6.0 Compiler API

Copyright © by JavaBeat · All rights reserved