I'm new to JSF and in the process of learning im building an online book store application.
I have 1 class and 1 bean: Book.java
and BookCatelogBean.java
. The Book class has 3 properties: id
, title
, and author
with it's corresponding getters and setters. The BookCatelogBean
contains an ArrayList<Book>
where I populate it with Books
(in future I will connect it to a database).
I have two pages: index.xhtml
and book.xhtml
. I want to display the list of book titles on index.xhtml
each formatted as a REST link and their ID to book.xhtml
, like so: <h:link outcome="book?id=#{bookCatelogBean.id}" value="#{bookCatelogBean.title}" />
I know how to use BookCatelogBean
to display 1 book
but I want to display all of them? I have an idea to call a method from BookCatelogBean
called getAllBooks()
that returns each of the books titles but how would I return each one of them to index.xhtml as a JavaserverFace link instead of a string?
Thanks
Here is my code:
Book.java
package bookshop;
import java.io.Serializable;
public class Book implements Serializable {
private int id;
private String title;
private String author;
public Book(int id, String title, String author){
this.title = title;
this.id = id;
this.author = author;
}
public String getAuthor() {
return author;
}
public void setAuthor(String author) {
this.author = author;
}
public int getId() {
return id;
}
public void setId(int id) {
this.id = id;
}
public String getTitle() {
return title;
}
public void setTitle(String title) {
this.title = title;
}
}
BookCatelogBean.java
package bookshop;
import java.io.Serializable;
import java.util.ArrayList;
import java.util.Arrays;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;
@ManagedBean
@SessionScoped
public class BookCatelogBean implements Serializable {
private int currentItem = 0;
private ArrayList<Book> books = new ArrayList<Book>(Arrays.asList(
new Book(1, "Theory of Money and Credit", "Ludwig von Mises"),
new Book(2, "Man, Economy and State", "Murry Rothbard"),
new Book(3, "Real Time Relationships", "Stefan Molyneux")));
public String getTitle(){
return books.get(currentItem).getTitle();
}
public int getId(){
return books.get(currentItem).getId();
}
public String getAuthor(){
return books.get(currentItem).getAuthor();
}
}
index.xhtml
<?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"
xmlns:h="http://java.sun.com/jsf/html">
<h:head>
<title>BookShop</title>
</h:head>
<h:body>
<h:link outcome="book?id=#{bookCatelogBean.id}" value="#{bookCatelogBean.title}" />
</h:body>
</html>
JSF2 offers two iterating components out the box: <ui:repeat>
and <h:dataTable>
. The former renders nothing to the response (so you have 100% control over the final HTML output), while the latter renders a HTML <table>
to the response and requires a <h:column>
to represent a column of <td>
s. Both components can take among others a List<E>
as value.
So, you can just have your managed bean like follows:
@ManagedBean
@RequestScoped
public class BookCatalog implements Serializable {
private List<Book> books;
@PostConstruct
public void init() {
books = new ArrayList<Book>();
books.add(new Book(1, "Theory of Money and Credit", "Ludwig von Mises"));
books.add(new Book(2, "Man, Economy and State", "Murry Rothbard"));
books.add(new Book(3, "Real Time Relationships", "Stefan Molyneux"));
}
public List<Book> getBooks() {
return books;
}
}
And you can use <ui:repeat>
to generate for example an <ul><li>
:
<ul>
<ui:repeat value="#{bookCatalog.books}" var="book">
<li>
<h:link value="#{book.title}" outcome="book">
<f:param name="id" value="#{book.id}" />
</h:link>
</li>
</ui:repeat>
</ul>
(note that the var
attribute basically exposes the currently iterated item by exactly the given name in the EL scope within the component)
And here's how to use a <h:dataTable>
instead:
<h:dataTable value="#{bookCatalog.books}" var="book">
<h:column>
<h:link value="#{book.title}" outcome="book">
<f:param name="id" value="#{book.id}" />
</h:link>
</h:column>
</h:dataTable>
As to the JSTL <c:forEach>
, that's also quite possible, but you should keep in mind that JSTL tags have a different lifecycle than JSF components. Long story short: JSTL in JSF2 Facelets... makes sense?
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With