views:

921

answers:

1

Hi there
I hava an unordered List navigation and i wanted to transform this to JSF code. Actually , there is no JSF tag ..

Here is the raw-HTML Navigation :

<ul id="navbar">
<li id="articles"><a href="Link1">Articles</a></li>
<li id="topics"><a href="Link2" title="Topics">Topics</a></li>
....
</ul>

..so what should i do ?

+2  A: 

One way to do ad-hoc templating is to use Facelets instead of JSPs. Since these have become part of JSF 2.0 (due in JEE6), I think it is a good time to consider them.

For example, for the beans:

public class LiBean implements Serializable {

  private static final long serialVersionUID = 1L;

  private String href;
  private String title;

  public String getHref() { return href; }

  public void setHref(String href) { this.href = href; }

  public String getTitle() { return title; }

  public void setTitle(String title) { this.title = title; }

}

...and:

public class UlBean implements Serializable {

  private static final long serialVersionUID = 1L;

  private final List<LiBean> listItems = new ArrayList<LiBean>();

  public UlBean() {
    String[] links = { "http://www.sun.com", "Sun",
        "http://www.oracle.com", "Oracle",
        "http://www.ibm.com", "IBM",
        "http://stackoverflow.com",
        "<stackoverflow.com> & encoded output" };
    for (int i = 0; i < links.length; i++) {
      LiBean item = new LiBean();
      item.setHref(links[i]);
      item.setTitle(links[++i]);
      listItems.add(item);
    }
  }

  public List<LiBean> getListItems() {
    return listItems;
  }

}

...defined in session scope:

  <managed-bean>
    <managed-bean-name>ulBean</managed-bean-name>
    <managed-bean-class>beans.UlBean</managed-bean-class>
    <managed-bean-scope>session</managed-bean-scope>
  </managed-bean>

...can be used in this Facelet page:

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
<html xmlns="http://www.w3.org/1999/xhtml"
  xmlns:ui="http://java.sun.com/jsf/facelets"
  xmlns:h="http://java.sun.com/jsf/html"&gt;
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>repeat</title>
</head>
<body>
<ul>
  <ui:repeat value="#{ulBean.listItems}" var="item">
    <li><a href="#{item.href}"><h:outputText
      value="#{item.title}" /></a></li>
  </ui:repeat>
</ul>
</body>
</html>

...to produce this output:

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
<html xmlns="http://www.w3.org/1999/xhtml"&gt;
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>repeat</title>
</head>
<body>
<ul>
    <li><a href="http://www.sun.com"&gt;Sun&lt;/a&gt;&lt;/li&gt;
    <li><a href="http://www.oracle.com"&gt;Oracle&lt;/a&gt;&lt;/li&gt;
    <li><a href="http://www.ibm.com"&gt;IBM&lt;/a&gt;&lt;/li&gt;
    <li><a href="http://stackoverflow.com"&gt;&amp;lt;stackoverflow.com&amp;gt; &amp; encoded output</a></li>
</ul>
</body>
</html>


If you are sticking with JSPs, there isn't anything in the core implementation that will let you do this (the only repeating control is the dataTable). You may find something in one of the 3rd party component libraries.

McDowell
Maybe worth adding that Facelets has no issue with mixing JSF components and standard HTML (no need for f:verbatim). You can just add the list items as they are if you want.
Damo
Well, you have to be careful about that. JSF does have issues when mixing HTML tags with JSF tags when it comes to Ajax calls. We've experienced a lot of issues with that in the past.
Matthias Hryniszak