Lição 1.2: Conectar-se a um Banco de Dados e Exibir Dados em uma Página da Web

Nessa lição, você aprenderá como conectar-se a um banco de dados e exibir registros de dados em uma página da Web. Você também aprenderá como incluir uma lista de registros relacionais na sua página da Web.

Por Que e Quando Desempenhar Esta Tarefa

O Web site neste tutorial utiliza páginas dinâmicas da Web com componentes do JavaServer Faces para acessar um banco de dados e exibir informações sobre a página. Esse tutorial utiliza registros relacionais e listas de registros relacionais para representar os dados em um banco de dados, para que os dados possam ser exibidos na página em forma de uma tabela de dados ou de uma tabela HTML comum. Os beans de acesso Java são utilizados por esses componentes.

Aprenda Mais Sobre Beans de Acesso a Dados

Os beans de acesso a dados são representações de beans Java de beans corporativos. Normalmente, eles são utilizados em programas clientes que implementam os arquivos, servlets ou beans corporativos de JSP (JavaServer Pages) que fazem interface com outros beans corporativos. Os beans de acesso eliminam as complexidades de gerenciar ciclos de vida de enterprise beans. Isso significa que é possível programar para beans corporativos tão facilmente como pode programar para beans Java, o que simplifica seus programas clientes de beans corporativos e reduz o tempo total de desenvolvimento.

Aprenda Mais Sobre JavaServer Faces e Componentes Faces

JavaServer Faces é uma tecnologia que ajuda a construir interfaces com o usuário para aplicativos dinâmicos da Web que são executados em um servidor. A estrutura JavaServer Faces gerencia o estado da UI entre pedidos ao servidor e oferece um modelo simples para o desenvolvimento de eventos do lado do servidor que são ativados pelo cliente. JavaServer Faces se baseia em uma estrutura MVC (Model-View-Controller). Para o JavaServer Faces, isso significa que o controlador é um servlet, o modelo é representado por JavaBeans e a visualização é composta de componentes JavaServer Faces com pouco ou nenhum código de aplicativo. O objetivo desse modelo é separar o conteúdo da apresentação.

Ferramentas, como Componentes Faces, ajudam a utilizar essa tecnologia em seus aplicativos da Web. Os Componentes Faces incluem uma biblioteca de tags personalizadas JSP (JavaServer Page) para expressar uma interface JavaServer Faces em uma página. Esse assistente ajuda a criar arquivos JSP que são habilitados para utilizar os componentes Faces. Os componentes Faces permitem desenvolver um aplicativo da Web arrastando componentes de uma gaveta Faces na visualização Paleta (Palette) e soltando-os nas páginas da Web que estão sendo criadas.

Por exemplo, você pode arrastar um campo de texto de entrada e soltá-lo em um formulário na página. Em seguida, você pode arrastar e soltar um botão Submeter (Submit) junto ao campo de texto de entrada. Finalmente, você pode conectar o campo de texto de entrada à origem de dados. Isso permitirá que os usuários finais digitem dados do aplicativo da Web em sua origem de dados.

Outro benefício de aplicativos construídos utilizando componentes Faces é que a interface com o usuário é apresentada independentemente da lógica do programa de base. Isso significa que seus aplicativos podem executar e acessar dados em diferentes plataformas, como navegadores ou dispositivos de mão.

Gaveta da Paleta de Componentes Faces Avançados.

Incluir uma Lista de Registros Relacionais

Por Que e Quando Desempenhar Esta Tarefa

Nesta lição, você criará uma lista de registros relacionais para representar todos os anúncios classificados no banco de dados. Em seguida, você se conectará ao banco de dados e selecionará a tabela que contém as informações necessárias na lista de registros relacionais. Por último, você exibirá essa lista de registros relacionais na página em uma tabela de dados.

Os registros relacionais conectam-se a somente um registro de um banco de dados. Neste caso, um registro relacional representa um único anúncio classificado do banco de dados da amostra.Utilizando um registro relacional, é possível criar um novo registro, editar um registro existente ou excluir um registro antigo.
As listas de registros relacionais conectam-se a mais de um registro de um banco de dados. Neste caso, uma lista de registros relacionais representa de dois a todos os anúncios classificados no banco de dados da amostra.
As tabelas de dados exibem os dados de uma lista de registros relacionais na página. As tabelas de dados simplesmente designam um lugar para as listas de registros; elas não formatam os dados em linhas e colunas como faz uma tabela HTML.
Aprenda Mais sobre Tabelas de Dados
A tabela de dados é um componente em uma página Faces JSP que contém objetos de dados, como uma lista de registros relacionais. Embora uma tabela de dados pareça ter linhas e colunas como uma tabela HTML, ela não funciona como uma tabela HTML. Se você quiser formatar controles de entrada e saída como em uma tabela, deverá utilizar um painel - Caixa de Grupo da gaveta Componentes Faces Avançados na Paleta (Group Box from the Enhanced Faces Components drawer in the Palette). Isso é coberto no Exercício 2.2: Formatando uma Tabela de Dados.
Utilizando a visualização Propriedades (Properties), é possível personalizar uma tabela de dados de várias maneiras:
- Incluir, remover e alterar a ordem de colunas
- Formatar texto e segundo plano
- Incluir cabeçalho, rodapé e margens
- Incluir paginação para exibição de resultados

Para criar uma nova lista de registros relacionais:

Na visualização Explorador Corporativo (Enterprise Explorer) da perspectiva da Web, expanda ClassifiedsTutorial > WebContent.
Na pasta WebContent, dê um clique duplo em all_records.jsp. O arquivo all_records.jsp é aberto no editor.
Exclua o texto padrão Insira o conteúdo aqui (Insert content here).
Na visualização Paleta (Palette), expanda a gaveta Dados e Serviços (Data and Services).
Arraste o componente Lista de Registros Relacionais SDO (SDO Relational Record List) da Paleta para a área de conteúdo em branco. A janela Incluir Lista de Registros Relacionais (Add Relational Record List) é exibida.
No campo Nome, digite all_recordlist. Os nomes de listas de registros relacionais e de registros relacionais devem respeitar as convenções de nomenclatura padrão Java para nomes de variáveis (por exemplo, não podem conter espaços).
Certifique-se de que Incluir Controles de Dados (Add data controls) esteja selecionado. Quando Incluir Controles de Dados (Add data controls) for selecionado, o assistente criará uma tabela de dados para exibir a lista de registros na página. Caso contrário, o assistente criará somente a lista de registros e não uma representação dos dados na página. No momento, o assistente criará a tabela de dados padrão e você a personalizará posteriormente. A janela Incluir Lista de Registros Relacionais (Add Relational Record List) deve ser semelhante a esta:

Clique em Avançar (Next).
No campo Nome (Name) na próxima página do assistente, clique em Novo (New) para criar uma nova conexão com o banco de dados. O diálogo Procura de Perfil (Profile Browse) é exibido.
No Procura de Perfil (Profile Browse), clique em New (Novo). O diálogo Novo Perfil de Conexão (New Connection Profile) é exibido.
Na lista Tipos de Perfis de Conexão (Connection Profile Types), selecione Derby e, em seguida, clique em Avançar (Next). O diálogo Criar Perfil de Conexão é exibido.
No campo Name (Nome), digite DerbyDB, selecione Autoconexão na inicialização (Auto-connect at startup) e, em seguida, clique em Avançar (Next).
No campo Drivers, selecione Derby 10.2 - Driver JDBC Integrado Padrão (Derby 10.2 - Embedded JDBC Driver Default).
No campo Local do banco de dados, clique em Procurar (Browse) e selecione <workspace_location>\ClassifiedsTutorial\WebContent\database, em que <workspace_location> é o diretório de seu espaço de trabalho atual. Clique em Concluir (Finish).
No diálogo Procura de Perfil (Profile Browse), clique em DerbyDB e, em seguida, clique em OK.Você retornará ao assistente Incluir Lista de Registros Relacionais.
Clique em Configurar Conexões do Banco de Dados do Projeto (Configure project's database connections). A janela Propriedades das Conexões JDBC é exibida.
Clique em Editar (Edit), próximo à seção de detalhes das conexões de tempo de execução. Selecione Utilizar Conexão do Gerenciador de Driver (Use driver manager connection) como o tipo de conexão de tempo de execução. Clique em Concluir (Finish) e clique em OK para retornar ao diálogo diálogo Incluir Lista de Registros Relacionais. Agora que você criou uma conexão com o banco de dados Derby, é necessário escolher uma tabela ou a lista de registros a ser representada. O assistente Incluir Lista de Registros Relacionais mostra as tabelas no banco de dados.
Expanda W5SAMPLE e selecione ADS. Clique em Avançar (Next). As páginas restantes no assistente permitem excluir colunas da lista de registros e executar opções avançadas, como definir a chave primária, incluir relacionamentos a outras tabelas e especificar condições de filtragem e de classificação. Você aprenderá mais sobre essas páginas em exercícios posteriores.
Na página Incluir Registro Relacional (Add Relational Record) do diálogo, especifique as colunas que você deseja incluir na lista de registros relacionais. Clique em Avançar (Next).
Para este tutorial, é necessário mostrar somente o título, a descrição, a categoria, o preço e o número de telefone de cada anúncio classificado. Por padrão, todas as colunas são selecionadas; clique para limpar todas, exceto as seguintes colunas, da exibição:
- CATEGORIA PRINCIPAL (MAINCATEGORY): Cadeia
- TÍTULO (TITLE): Cadeia
- DESCRIÇÃO (DESCRIPTION): Cadeia
- PREÇO (PRICE): BigDecimal
- FONE (PHONE): Cadeia
Você pode refinar a organização da exibição da tabela de dados na página da Web. Para reordenar as colunas, selecione uma coluna e clique nas setas para cima e para baixo até que a coluna esteja na posição desejada.
Organize as colunas na seguinte ordem:
- TÍTULO (TITLE)
- DESCRIÇÃO (DESCRIPTION)
- CATEGORIA PRINCIPAL (MAINCATEGORY)
- PREÇO (PRICE)
- FONE (PHONE)
Clique em Concluir (Finish).
Sua página da Web será semelhante a esta:
Salve a página.

Resultados

Na próxima lição, você verá como esta página aparecerá em um servidor da Web real. Existem muitas opções para formatar tabelas de dados e componentes JavaServer Faces. Algumas dessas opções são abrangidas no próximo módulo. Pode-se, também, explorar a visualização Propriedades (Properties) por conta própria para descobrir os diversos componentes JavaServer Faces na página (por exemplo, a tabela de dados e os componentes de saída individuais).

Ponto de Verificação do Exercício

Você concluiu a Lição 1.2. Nela, você aprendeu como conectar-se com um banco de dados e exibir registros de dados em uma página da Web utilizando uma lista de registros relacionais.

< Anterior | Próximo >

Feedback