Home/ Questions/Q 8532605
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-11T09:45:12+00:00

I want to display details about a product when a user clicks on a

  • 0

I want to display details about a product when a user clicks on a link with the name of that product.

When debugging my code I see that the details method shown in the code below doesn’t run.

My code: 

<html xmlns="http://www.w3.org/1999/xhtml"
  xmlns:h="http://java.sun.com/jsf/html"
  xmlns:ui="http://java.sun.com/jsf/facelets">
<h:body>
    <ui:composition template="/Shared/layout.xhtml" >
        <ui:define name="title">Product</ui:define>
        <ui:define name="body">
            <div id="contents" >
                <h3> List Product in Site </h3>
                <ul>
                    <ui:repeat value="#{productBean.listProduct}" var="p">
                        <div id="list-item">
                            <div class='item' >
                                <div class='item-img' >
                                    <h:form>
                                        <input type="hidden" name="productId" value="#{p.productId}" />
                                        <h:commandLink action="#{productBean.details}">
                                            <h:graphicImage url="#{p.picture}" alt='No Picture' />
                                        </h:commandLink>
                                    </h:form>
                                </div>
                                <h:form>
                                    <input type="hidden" name="productId" value="#{p.productId}" />
                                    <h:commandLink value="#{p.name}" action="#{productBean}" >
                                    </h:commandLink>
                                </h:form>
                            </div>    
                        </div>
                    </ui:repeat>
                </ul>
                <h:form>
                    <h:commandLink value="text" action="#{productBean.test}">  <!-- test -->
                    </h:commandLink>
                </h:form>
            </div>
        </ui:define>
    </ui:composition>
</h:body>

ProductBean:

@ManagedBean
@RequestScoped
public class ProductBean implements Serializable {

    private List<Products> listProduct;
    private List<Categories> listCategory;
    private Products product;

    public Products getProduct() {
        return product;
    }

    public void setProduct(Products product) {
        this.product = product;
    }

    public ProductBean() {
        listCategory = new ProductsDB().listCategory();
    }
    private int categoryId;

    public int getCategoryId() {
        return categoryId;
    }

    public void setCategoryId(int categoryId) {
        this.categoryId = categoryId;
    }

    public String listProductByCt() {
        try {
            String value = FacesContext.getCurrentInstance().
                    getExternalContext().getRequestParameterMap().get("categoryId");
            setCategoryId(Integer.parseInt(value));
            if (categoryId == 0) {
                return "index";
            }
            listProduct = new ProductsDB().listProducts(categoryId);
            return "product";
        } catch (Exception e) {
            return "error";
        }
    }

    public String details() {
        String s = "";
        try {
            String productId = FacesContext.getCurrentInstance().
                    getExternalContext().getRequestParameterMap().get("productId");
            if (productId != null) {
                product = new ProductsDB().getProductById(productId);
                return "details";
            }
        } catch (Exception e) {
            return "error";
        }
        return "error";
    }

    public String test()
    {
        return "s";
    }



    public List<Categories> getListCategory() {
        return listCategory;
    }

    public void setListCategory(List<Categories> listCategory) {
        this.listCategory = listCategory;
    }

    public List<Products> getListProduct() {
        return listProduct;
    }

    public void setListProduct(List<Products> listProduct) {
        this.listProduct = listProduct;
    }
}

I’ve also tried with another method called test. This too is referenced from an action on products.xhtml, but that action isn’t placed inside a <ui:repeat>. In this case, the method does gets executed.

The test method:

public String test() {
    String productId = "IP16G";
    product = new ProductsDB().getProductById(productId);
    return "details";
}
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Which version of JSF are you using?

    The code you’ve shown with different forms and hidden inputs inside a ui:repeat is not really idiomatic JSF. There’s also a typo in the action of your first command link. It says produtBean but I guess it should be productBean. JSF will give you an exception though if you click on that command link.

    Did you got that exception, or did nothing happen?

    In case nothing happened, a likely cause is that the data you used to render your command links (#{productBean.listProduct}) is not available anymore after the post back. What method are you using to obtain this data and what is the scope of your bean? In many cases you should be using @ViewScoped and initialize the data when the request is not a post back.

    Also, make sure there is no parent component of the <ui:repeat> that has a rendered attribute that is set to false by default. In case this attribute will be set to true at some point of the life-cycle, this may well be -after- the click on the link is processed. If that happens, it will still be false when the click is being processed, which has the effect that it will silently be ignored.

    You can test the last effect by putting your test command link right next to the <ui:repeat>:

    <ui:repeat value="#{productBean.products}" var="product">
    ...
</ui:repeat>
<h:commandLink value="test" action="#{productBean.test}" />

    Although your approach with the multiple forms and hidden fields does work, a more idiomatic JSF version would be:

    <h:form>
    <ui:repeat value="#{productBean.products}" var="product">
        <h:commandLink action="#{productBean.details(product)}">
            <h:graphicImage url="#{product.picture}" alt="No Picture" />
        </h:commandLink>

        <h:commandLink value="#{product.name}" action="#{productBean.details(product)}" />
    </ui:repeat>
</h:form>

    With your bean’s details method as:

    public String details(Product product) {
    this.product = product;
    return "details";
}

    (getting more off-topic, but if all your method does is returning a navigation case, you might want to consider using a direct link like <h:link> with the Id of your product as a parameter. This will use GET to go to your destination page, which in this case is much cleaner)

    EDIT

    In order to test whether the problem isn’t somewhere else, try the following code. It’s a single page and a single backing bean. Add these to your project and request the page. This should work.

    forminloop.xhtml:

    <html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:ui="http://java.sun.com/jsf/facelets">

    <h:body>

        <ui:repeat value="#{formInLoopBacking.items}" var="item">
            <h:form>
                <h:commandLink value="#{item}" action="#{formInLoopBacking.action}"/>
            </h:form>
        </ui:repeat>

    </h:body>
</html>

    FormInLoopBacking.java

    import javax.faces.bean.ManagedBean;

@ManagedBean
public class FormInLoopBacking {

    private String[] items = {"A", "B"};

    public String[] getItems() {
        return items;
    }

    public void action() {
        System.out.println("Action called");
    }

}
    • 0