Solucionado (ver solução)
Solucionado
(ver solução)
3
respostas

Ajuda com conteudo dinamico

Bom dia, inicialmente não sei se minha dúvida se encaixaria na parte de programação ou de front - end por isso estou deixando na parte geral, caso os moderadores queiram, podem mover para a área que achar correta.

Vamos lá, estou montando um projeto, que vai funcionar como se fosse uma vitrine virtual, e logo de cara na Home.xhtml vai aparecer alguns "blocos " ou "cards" que exibirá as categorias dos produtos (algo bem similar às categorias dos cursos aqui da Alura). O que preciso saber é o seguinte, criei uma div e montei 1 categoria na mão, porém eu quero que esses "cards ou boxes" sejam gerados dinamicamente de acordo com as categorias existentes no banco. Como devo proceder?

Estou usando JSF 2.2, JPA, CDI e Primefaces

3 respostas

Olá Jilles,

Uma possibilidade seria você utilizar o <ui:repeat>. Ele permite você percorrer uma lista (que pode vir do seu banco, por exemplo) e repetir um conjunto de tags para cada elemento dessa lista. No seu caso ficaria algo parecido com isso:

<ui:repeat var="categoria" value="#{categoriaBean.categorias}">
    <div>
        #{categoria.nome} - #{categoria.descricao}
    </div>  
</ui:repeat>

Não se esqueça de registrar o namespace na tag <html>:

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

Faça um teste e veja se ajuda!

solução!

Opa fala aí Jilles tudo bem?

Não sei se eu entendi direito sua dúvida, mas estou imaginando isso:

Você tem na sua aplicação uma entidade no banco de dados que representa uma categoria.

Logo você teria um DAO para essa entity e teria um método por exemplo list que retorna todas as categorias.

Sendo assim podemos ter um atributo List<Categoria> chamado categorias com um getter para ele , dentro de um Bean por exemplo HomeBean.

Pensando que temos esse cenário podemos iterar sobre essa lista da seguinte maneira:

    <html xmlns:ui="http://java.sun.com/jsf/facelets">

    ...    

    <ui:repeat value="#{homeBean.categorias}" var="categoria">
        <div id="card">
            <div id="card.header">
                 #{categoria.title} 
            </div>

            <div id="card.body">
                #{categoria.description}
            </div>

        </div>
    </ui:repeat>

    ...
    </html>

Se útil marque como solução

era isso mesmo, ambas as respostas me ajudaram,,, obrigado

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software