Hi. I have some problems creating a page to add items into a cart. The page loads dynamic products from a database, and i would like to know how to group this products so that when i click a button, my CartBean gets updated by that product clicked.

here, my xhtml page.

<h:body style=" background-color: #eeeeee">
    <div id="content" align="center">
        <!-- Division containing the top content-->
        <div id="top">
            <table width="70%">
                <tr valign="center">
                    <td align="left">
                        <c:if test="${login.login}">
                            Bem vindo <b>${login.name}</b>, boas compras.
                        </c:if>
                    </td>
                </tr>
                <tr>
                    <td>
                        <h:form>
                            <h:commandButton value="LOGO"/>
                            <h:inputText id="searchTxt" size="50" value="#{searchEngine.searchWord}"/>
                            <h:commandLink id="searchBtn" action="buscar" actionListener="#{searchEngine.searchMethod}">
                                <h:graphicImage url="resources/lupa1.jpg" style=" vertical-align: bottom"/>
                            </h:commandLink> 
                            &nbsp;
                            <h:commandLink value="Sobre Nós" action="index"/>
                            &nbsp;|&nbsp;
                            <h:commandLink value="Fale Conosco" action="contato"/>
                            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                            <h:commandLink value="Criar Conta" action="cadastro"/>
                            &nbsp;|&nbsp;
                            <h:commandLink value="Login" action="login"/>
                        </h:form>
                    </td>
                </tr>
            </table>
        </div>
        <!-- Division containing the main table -->
        <div id="table">
            <table width="70%">
                <tr>
                    <td bgcolor="#999999" style="width:20%">
                        <h1><font color="#cccccc">Categorias de Produtos do Site</font></h1>
                    </td>
                    <td bgcolor="#333333" style="width:60%; vertical-align: bottom">
                        <font color="#ffffff">
                            Resultados da busca por '${searchEngine.lastSearch}'</font>
                    </td>
                    <td bgcolor="#eeeeee" style="width:20%">
                        The right side
                    </td>
                </tr>
                <tr>
                    <td valign="top" bgcolor="#333333">
                        <div id="demo">
                            <p><a href="#" class="eletronicos">Eletrônicos</a></p>
                            <p><a href="#" class="cameras-filmadoras">Câmeras e Filmadoras</a></p>
                            <p><a href="#" class="celulares">Celulares</a></p>
                            <p><a href="#" class="informatica">Informática</a></p>
                            <p><a href="#" class="perfumaria">Perfumaria</a></p>
                        </div>
                    </td>
                    <td bgcolor="#ffffff" valign="top">
                        <p>A busca pelo termo '${searchEngine.lastSearch}' retornou a seguinte relação de produtos, em ordem alfabética:</p>
                        <c:forEach items="${searchEngine.products}" var="product">
                            <table align="center" width="95%">
                                <tr bgcolor="#eeeeee">
                                    <th colspan="2" align="left"><b>${product.name}</b></th>
                                </tr>
                                <tr>
                                    <td width="35%">
                                        <h:graphicImage url="products/${product.url}"/>
                                    </td>
                                    <td width="65%">
                                        <p><font color="#DD0000" size="3">R$ ${product.inCash} à vista</font></p>
                                        <p><font color="#DD0000" size="5">${product.instalments} X <font size="7">${product.paymentDeadline}</font></font>
                                            <h:form>
                                                <h:commandButton action="#{carrinho.add(product.name)}" value="adicionar"/>
                                            </h:form>
                                        </p>
                                    </td>
                                </tr>
                            </table>
                        </c:forEach>


                    </td>
                    <td bgcolor="#ffffff" valign="top">
                        Caso não encontre os produtos desejádos, mande-nos um e-mail e entraremos em contato.
                    </td>
                </tr>
            </table>
        </div>
        <div id="bottom">
            <table>
                <tr>
                    <td>
                        <p>Logo Inferior</p>
                        <p><font size="2">&copy; 2012 Loja de Importados</font></p>
                    </td>
                    <td>
                        <h:form>
                            <h:commandLink value="Sobre Nós" action="contato"/>
                            &nbsp;|&nbsp;
                            <h:commandLink value="Fale Conosco" action="contato"/>
                            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                            <h:commandLink value="Criar Conta" action="cadastro"/>
                            &nbsp;|&nbsp;
                            <h:commandLink value="Login" action="login"/>
                        </h:form>
                    </td>
                </tr>
            </table>
        </div>
    </div>
</h:body>;