29 de dezembro de 2010

JavaEE 5: SelectOneMenu (comboBox) em JSF 1.2

Na postagem de hoje iremos fazer um SelectOneMenu ou como a maioria conhece ComboBox em JSF 1.2, numa mesma página teremos um dinâmico onde a lista vem de um bean e um estático onde os itens são definidos diretamente no código fonte da página. Segue a imagem:


Segue o código fonte do ClienteBean:

import java.util.ArrayList;
import java.util.List;
import javax.faces.model.SelectItem;

public class ClienteBean {
 private List< SelectItem > selectItemsClientes;
 private int codigoClienteSelecionado;

 public List< SelectItem > getSelectItemsClientes() {
  selectItemsClientes = new ArrayList< SelectItem >();
  selectItemsClientes.add(new SelectItem(1, "Andii"));
  selectItemsClientes.add(new SelectItem(2, "João"));
  selectItemsClientes.add(new SelectItem(3, "Maria"));
  return selectItemsClientes;
 }

 public void setSelectItemsClientes(List< SelectItem > selectItemsClientes) {
  this.selectItemsClientes = selectItemsClientes;
 }

 public int getCodigoClienteSelecionado() {
  return codigoClienteSelecionado;
 }

 public void setCodigoClienteSelecionado(int codigoClienteSelecionado) {
  this.codigoClienteSelecionado = codigoClienteSelecionado;
 } 
}

Nesse bean, temos um int que corresponde ao valor selecionado no combo, e uma lista de SelectItem (veja que o SelectItem pertence ao pacote javax.faces, sendo do próprio JSF) com valores que eu setei diretamente no bean(claro que poderiam ser valores do banco), aí vem a pergunta: mas essa lista não poderia ser de objetos mesmo, tipo List< Cliente >? A resposta é sim! Poderia ser uma lista com o objeto Cliente mesmo, porém, iria dar um trabalho muito grande para pegar esse valor, tendo que criar converter e ainda podendo enfrentar problemas de conversão! Para entender melhor, leia isso!

OBS: Lembre-se de mapear o ClienteBean no faces-config.xml, nesse exemplo usei o escopo session mesmo.

Agora segue o código fonte da página jsp que tem os comboBox:
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
<html>
<f:view>
 <head>
  <title>Clientes</title>
 </head>
 <body>
  <h:panelGrid columns="1">
   <h:outputText value="SelectOneMenu com lista dinâmica" />
   <h:selectOneMenu value="#{clienteBean.codigoClienteSelecionado}">
    <f:selectItems value="#{clienteBean.selectItemsClientes}" />
   </h:selectOneMenu>
   
   <h:outputText value="SelectOneMenu com lista estática" />
   <h:selectOneMenu value="#{clienteBean.codigoClienteSelecionado}">
    <f:selectItem itemValue="1" itemLabel="Andii"/>
    <f:selectItem itemValue="2" itemLabel="João"/>
    <f:selectItem itemValue="3" itemLabel="Maria"/>
   </h:selectOneMenu>
  </h:panelGrid>
 </body>
</f:view>
</html>

Bom, para criar selectOneMenu dinâmico, usa-se o selectItems tendo como value a lista. Já para os casos estáticos, usa-se o selectItem setando o itemValue para o codigo do cliente(exemplo) e o itemLabel para o deverá aparecer na lista(exemplo: nome do cliente).

Aconselho dar uma olhada no link, tem vários outros componentes interessantes e úteis:  Mais componentes em JSF

14 de novembro de 2010

JavaEE 5: CRUD em dialogs com PrimeFaces 1.1

A postagem de hoje pode ser considerada uma alternativa para a essa postagem: CRUD em páginas com PrimeFaces 1.1
O que difere é que invés da navegação de páginas, nós teremos nosso CRUD em uma única página, em p:dialog, e nossos avisos de sucesso ou falha se darão através do p:growl(justamente o mesmo utilizado para informar os campos obrigatórios) não haverá necessidade de em caso de falha, enviar o usuário para uma página de erro, acredito que mostrar um aviso no p:growl seja mais que suficiente e mais agradável!
Então, o projeto é o mesmo que o do link acima, só criei um novo bean(CategoriaDialogBean.java) para não alterar o atual, e uma página (dialog.jsp) para mostrar esse exemplo, lembrando que para esse exemplo não será necessário nenhuma navegação no faces-config.xml.
Imagem da operação remover:

Explicando o que vai acontecer nesse CRUD:
Inserir Categoria: A partir da imagem acima no canto superior esquerdo existe um p:commandButton chamado "Nova", ao clicar nele, o mesmo abrirá um p:dialog assim como "Alterar Categoria" que aparece no fundo do modal do p:dialog "Remover Categoria".
Alterar Categoria: O p:dialog do "Alterar Categoria" é chamado ao clicar em uma linha da p:dataTable.
Remover Categoria: O p:dialog do "Remover Categoria" é chamado pelo p:commandButton "Remover" presente no p:dialog do "Alterar Categoria"
Quanto o envio de respostas do bean, este é feito através do javax.faces.context.FacesContext e do javax.faces.application.FacesMessage. Como isso funciona? Muito simples, no próprio método eu verifico a reposta do meu DAO, que pode ser sucesso ou falha... caso seja sucesso eu mando para a view uma mensagem de sucesso, ou em caso de falha, uma mensagem de falha...

Acredito que a explicação do funcionamento dos p:dialog tenha ficado clara, então, segue os códigos-fonte do bean e do jsp, apenas lembrando que continua sendo necessário o mapeamento do bean no faces-config.xml.
CategoriaDialogBean.java:
public class CategoriaDialogBean {
    //Atributos
    private Categoria categoria = new Categoria();
    private List<Categoria> categorias;
     
    //Métodos
    public void nova(){
        categoria = new Categoria();
    }
    
    //esses são os imports necessários para o FacesContext e FacesMessage:
    //import javax.faces.application.FacesMessage;
    //import javax.faces.context.FacesContext;    
    //ao inserir uma categoria, é verificado o retorno da mesma
    //caso tenha retornado "sucesso": é retornado "Inserido com sucesso" para nossa página 
    //e chamo o metodo nova() para limpar os campos!
    //caso seha "falha": é retornado: "Falha ao inserir"
    //quem mostrará essas mensagem será o mesmo componente do primefaces que mostra a validação dos campos
    //<p:growl>, assim funciona tambem para os métodos alterar e remover!
    //detalhe importante: dessa maneira não há necessidade de estar criando a navegação de 
    //páginas no faces-config.xml, perceba que os métodos não tem retorno!
    public void inserir(){
        Categoria_DAO dao = new Categoria_DAO();
        String retorno = dao.inserir(categoria);
        FacesContext mensagem = FacesContext.getCurrentInstance();
        if(retorno.equals("sucesso")){
            mensagem.addMessage(null, new FacesMessage(FacesMessage.SEVERITY_INFO, "Inserido com sucesso", null));
            this.nova();
        } else {
            mensagem.addMessage(null, new FacesMessage(FacesMessage.SEVERITY_ERROR, "Falha ao inserir", null));
        }
    }

    public void selecionar(int codigo){
        Categoria_DAO dao = new Categoria_DAO();
        categoria = dao.selecionar(codigo);
    }

    public void alterar(){
        Categoria_DAO dao = new Categoria_DAO();
        String retorno = dao.alterar(categoria);
        FacesContext mensagem = FacesContext.getCurrentInstance();
        if(retorno.equals("sucesso")){
            mensagem.addMessage(null, new FacesMessage(FacesMessage.SEVERITY_INFO, "Alterado com sucesso", null));
        } else {
            mensagem.addMessage(null, new FacesMessage(FacesMessage.SEVERITY_ERROR, "Falha ao alterar", null));
        }
    }

    public void remover(){
        Categoria_DAO dao = new Categoria_DAO();
        String retorno = dao.remover(categoria.getCodigo());
        FacesContext mensagem = FacesContext.getCurrentInstance();
        if(retorno.equals("sucesso")){
            mensagem.addMessage(null, new FacesMessage(FacesMessage.SEVERITY_INFO, "Removido com sucesso", null));
            this.nova();
        } else {
            mensagem.addMessage(null, new FacesMessage(FacesMessage.SEVERITY_ERROR, "Falha ao remover", null));
        }
    }

    //Getters e Setters

    public Categoria getCategoria() {
        return categoria;
    }

    public void setCategoria(Categoria categoria) {
        this.categoria = categoria;
    }

    public List<Categoria> getCategorias() {
        Categoria_DAO dao = new Categoria_DAO();
        categorias = dao.listar();
        return categorias;
    }

    public void setCategorias(List<Categoria> categorias) {
        this.categorias = categorias;
    }

}


Mapeamento do bean no faces-config.xml:
<managed-bean>
  <managed-bean-name>categoriaDialogBean</managed-bean-name>
  <managed-bean-class>control.CategoriaDialogBean</managed-bean-class>
  <managed-bean-scope>session</managed-bean-scope>
</managed-bean>


dialog.jsp:
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
<%@ taglib uri="http://primefaces.prime.com.tr/ui" prefix="p"%>

<html>
<f:view>
    <head>
    <title>Categorias</title>
    <p:resources />
    </head>
    <body>
        <p:growl id="aviso" />
    
    <h:form id="formCategorias">
        <p:commandButton value="Nova" actionListener="#{categoriaDialogBean.nova}" oncomplete="inserir.show()" update="formInserir" />

        <p:dataTable value="#{categoriaDialogBean.categorias}" var="c"
            paginator="true" rows="5" emptyMessage="Categorias não encontradas!" selectionMode="single" 
            selection="#{categoriaDialogBean.categoria}" update="formAlterar" onselectComplete="alterar.show()">
            <p:column>
                <f:facet name="header">
                    <h:outputText value="Codigo" />
                </f:facet>
                <h:outputText value="#{c.codigo}" />
            </p:column>
            <p:column filterBy="#{c.nome}">
                <f:facet name="header">
                    <h:outputText value="Nome" />
                </f:facet>
                <h:outputText value="#{c.nome}" />
            </p:column>
            <p:column>
                <f:facet name="header">
                    <h:outputText value="Valor" />
                </f:facet>
                <h:outputText value="#{c.valor}" />
            </p:column>
            <p:column>
                <f:facet name="header">
                    <h:outputText value="Data" />
                </f:facet>
                <h:outputText value="#{c.data}">
                    <f:convertDateTime pattern="dd/MM/yyyy" />
                </h:outputText>
            </p:column>
        </p:dataTable>
    </h:form>
    
    <p:dialog widgetVar="inserir" header="Inserir Categoria" width="320" modal="true">
        <h:form id="formInserir">
            <h:panelGrid columns="2">
                <h:outputText value="Nome" />
                <h:inputText value="#{categoriaDialogBean.categoria.nome}" required="true" requiredMessage="Informe o nome" />
                <h:outputText value="Valor" />
                <h:inputText value="#{categoriaDialogBean.categoria.valor}" required="true" requiredMessage="Informe o valor" />
                <h:outputText value="Data" />
                <p:calendar value="#{categoriaDialogBean.categoria.data}" pattern="dd/MM/yyyy" locale="pt_BR" required="true" requiredMessage="Informe a data" />
                <p:commandButton value="Salvar" action="#{categoriaDialogBean.inserir}" update="aviso,formInserir,formCategorias" />
                <p:commandButton value="Cancelar" immediate="true" onclick="inserir.hide()" />
            </h:panelGrid>
        </h:form>    
    </p:dialog>
    
    <p:dialog widgetVar="alterar" header="Alterar Categoria" width="350">
        <h:form id="formAlterar">
            <h:panelGrid columns="2">
                <h:outputText value="Nome" />
                <h:inputText value="#{categoriaDialogBean.categoria.nome}" required="true" requiredMessage="Informe o nome" />
                <h:outputText value="Valor" />
                <h:inputText value="#{categoriaDialogBean.categoria.valor}" required="true" requiredMessage="Informe o valor" />
                <h:outputText value="Data" />
                <p:calendar value="#{categoriaDialogBean.categoria.data}" pattern="dd/MM/yyyy" locale="pt_BR" required="true" requiredMessage="Informe a data" />
            </h:panelGrid>
            <p:commandButton value="Salvar" action="#{categoriaDialogBean.alterar}" update="aviso,formAlterar,formCategorias" />
            <p:commandButton value="Remover" update="formRemover" oncomplete="remover.show()"/>
            <p:commandButton value="Cancelar" immediate="true" onclick="alterar.hide()" />
        </h:form>    
    </p:dialog>
    
    <p:dialog widgetVar="remover" header="Remover Categoria" width="400" modal="true">
        <h:form id="formRemover">
            <h:outputText value="Confirma a remoção: #{categoriaDialogBean.categoria.nome} ?" />
            <h:panelGrid columns="2">
                <p:commandButton value="Sim" action="#{categoriaDialogBean.remover}" update="aviso,formCategorias" oncomplete="alterar.hide(), remover.hide()" />
                <p:commandButton value="Não" onclick="remover.hide()" />
            </h:panelGrid>
        </h:form>    
    </p:dialog>
    
    </body>
</f:view>
</html>
Ah... peço desculpas pela demora da postagem, é que ando com problemas com minha internet! rsrs

Mas está aí!



=)

31 de outubro de 2010

JavaEE 5: CRUD em páginas com PrimeFaces 1.1

Esta postagem não difere muito desta: CRUD em JSF, o que difere é que teremos um pouco mais que um HTML puro como visualização, estaremos utilizando o PrimeFaces para criar a tabela com paginação e ter o inserir, alterar e remover dentro de painéis. Então, inicialmente a diferença do link acima é que nesta postagem estaremos utilizando valores como: double e java.util.Date, para mostrar que quando se trata de JSF não há necessidade de converter esses valores (no caso de view para controle) apenas na hora de armazenar no banco de dados é necessário converter o java.util.Date para java.sql.Date e vice-versa.

Iniciando...
Como estamos adicionando um valor(double) e uma data(java.util.Date) na nossa aplicação, segue o código SQL atualizado:
CREATE TABLE Categoria (
  `codigo` int(11) unsigned NOT NULL AUTO_INCREMENT,
  `nome` varchar(45) DEFAULT NULL,
  `valor` double DEFAULT NULL,
  `data` date DEFAULT NULL,
  PRIMARY KEY (`codigo`)
)
Eu criei essa tabela dentro de uma database "tads", caso não seja essa a sua, lembre-se de informar isso ao criar a conexão ;)

Estrutura geral da aplicação:

Crie um JSF Project com o nome de Prime, seguindo a estrutura crie os pacotes: control, dao e model (lembre-se de adicionar o connector do MySQL a aplicação, ensinado nas postagens anteriores). Segue os códigos das classes que foram atualizados: Categoria.java, Categoria_DAO.java :
model
Categoria.java:
public class Categoria {

    private int codigo;
    private String nome;
    private double valor;
    private Date data;
    
    public int getCodigo() {
        return codigo;
    }
    public void setCodigo(int codigo) {
        this.codigo = codigo;
    }
    public String getNome() {
        return nome;
    }
    public void setNome(String nome) {
        this.nome = nome;
    }
    public double getValor() {
        return valor;
    }
    public void setValor(double valor) {
        this.valor = valor;
    }
    public Date getData() {
        return data;
    }
    public void setData(Date data) {
        this.data = data;
    }
    
}

dao
Categoria_DAO.java:
public class Categoria_DAO {
    
    public String inserir(Categoria categoria){
        String retorno = "falha";
        Conexao conn = new Conexao();
        try{
            Date dataSql = new Date(categoria.getData().getTime());
            
            Statement stmt = (Statement) conn.getConn().createStatement();
            stmt.execute("insert into Categoria (nome, valor, data) values ('"+categoria.getNome()+"','"+categoria.getValor()+"','"+dataSql+"')");
            retorno =  "sucesso";
        }catch(Exception e){  
            e.printStackTrace();
        }finally {
            conn.fecharConexao();
        }
        
        return retorno;
    }
    
    public List<Categoria> listar(){
        List<Categoria> categorias = new ArrayList<Categoria>();
        Conexao conn = new Conexao();
        try{
            
            Statement stmt = (Statement) conn.getConn().createStatement();
            ResultSet rs = stmt.executeQuery("Select * from Categoria");
            while(rs.next()){
                Categoria categoria = new Categoria();
                categoria.setCodigo(rs.getInt("codigo"));
                categoria.setNome(rs.getString("nome"));
                categoria.setValor(rs.getDouble("valor"));
                categoria.setData(new SimpleDateFormat("yyyy-MM-dd").parse(rs.getString("data")));
                categorias.add(categoria);
            }
        }catch(Exception e){  
            e.printStackTrace();
        }finally {
            conn.fecharConexao();
        }
        
        return categorias;
    }
    
    public Categoria selecionar(int codigo){
        Categoria categoria = new Categoria();
        Conexao conn = new Conexao();
        try{
            Statement stmt = (Statement) conn.getConn().createStatement();
            ResultSet rs = stmt.executeQuery("Select * from Categoria where codigo = '"+codigo+"'");
            rs.next();
                categoria.setCodigo(rs.getInt("codigo"));
                categoria.setNome(rs.getString("nome"));
                categoria.setValor(rs.getDouble("valor"));
                categoria.setData(new SimpleDateFormat("yyyy-MM-dd").parse(rs.getString("data")));
        }catch(Exception e){  
            e.printStackTrace();
        }finally {
            conn.fecharConexao();
        }
        
        return categoria;
    }
    
    public String alterar(Categoria categoria){
        String retorno = "falha";
        Conexao conn = new Conexao();
        try{
            Date dataSql = new Date(categoria.getData().getTime());
            
            Statement stmt = (Statement) conn.getConn().createStatement();
            stmt.execute("update Categoria set nome = '"+categoria.getNome()+"', " +
                    "valor = '"+categoria.getValor()+"', data = '"+dataSql+"' " +
                            " where codigo = '"+categoria.getCodigo()+"'");
            retorno =  "sucesso";
        }catch(Exception e){  
            e.printStackTrace();
        }finally {
            conn.fecharConexao();
        }
        
        return retorno;
    }
    
    public String remover(int codigo){
        String retorno = "falha";
        Conexao conn = new Conexao();
        try{
            Statement stmt = (Statement) conn.getConn().createStatement();
            stmt.execute("delete from Categoria where codigo = '"+codigo+"'");
            retorno =  "sucesso";
        }catch(Exception e){  
            e.printStackTrace();
        }finally {
            conn.fecharConexao();
        }
        
        return retorno;
    }
}

Quanto as outras classes (CategoriaBean) continuam do mesmo jeito que no CRUD em JSF.
Agora o que muda também são nossos JSP's, para configurar o PrimeFaces 1.1: Clique aqui
Depois de configurado podemos começar a implementação dos nossos JSP's:
index.jsp:



Código-Fonte:
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
<%@ taglib uri="http://primefaces.prime.com.tr/ui" prefix="p"%>

<html>
<f:view>
    <head>
    <title>Categorias</title>
    <p:resources />
    </head>
    <body>
    <h:form>
        <p:commandButton value="Nova" action="#{categoriaBean.nova}"
            ajax="false" />

        <p:dataTable value="#{categoriaBean.categorias}" var="c"
            paginator="true" rows="5" emptyMessage="Categorias não encontradas!">
            <p:column>
                <f:facet name="header">
                    <h:outputText value="Codigo" />
                </f:facet>
                <h:outputText value="#{c.codigo}" />
            </p:column>
            <p:column filterBy="#{c.nome}">
                <f:facet name="header">
                    <h:outputText value="Nome" />
                </f:facet>
                <h:outputText value="#{c.nome}" />
            </p:column>
            <p:column>
                <f:facet name="header">
                    <h:outputText value="Valor" />
                </f:facet>
                <h:outputText value="#{c.valor}" />
            </p:column>
            <p:column>
                <f:facet name="header">
                    <h:outputText value="Data" />
                </f:facet>
                <h:outputText value="#{c.data}">
                    <f:convertDateTime pattern="dd/MM/yyyy" />
                </h:outputText>
            </p:column>
            <p:column>
                <f:facet name="header">
                    <h:outputText value="Ações" />
                </f:facet>
                <h:commandButton value="Editar"
                    actionListener="#{categoriaBean.selecionar(c.codigo)}"
                    action="alterar" image="/imagens/editar.png" />
                <h:commandButton value="Remover"
                    actionListener="#{categoriaBean.selecionar(c.codigo)}"
                    action="remover" image="/imagens/remover.png" />
            </p:column>
        </p:dataTable>
    </h:form>
    </body>
</f:view>
</html>

inserirCategoria.jsp:

Código-Fonte:
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<%@ taglib uri="http://primefaces.prime.com.tr/ui" prefix="p" %>
<html>
<f:view>
    <head>
        <title>Inserir Categoria</title>
        <p:resources />
    </head>
    <body>
        <p:growl id="aviso" />
    
        <p:panel header="Inserir Categoria" style="width: 320px" >
            <h:form>
                <h:panelGrid columns="2">
                    <h:outputText value="Nome" />
                    <h:inputText value="#{categoriaBean.categoria.nome}" required="true" requiredMessage="Informe o nome" />
                    <h:outputText value="Valor" />
                    <h:inputText value="#{categoriaBean.categoria.valor}" required="true" requiredMessage="Informe o valor" />
                    <h:outputText value="Data" />
                    <p:calendar value="#{categoriaBean.categoria.data}" pattern="dd/MM/yyyy" locale="pt_BR" required="true" requiredMessage="Informe a data" />
                    <p:commandButton value="Salvar" action="#{categoriaBean.inserir}" update="aviso" ajax="false" />
                    <p:commandButton value="Cancelar" action="cancelar" immediate="true" ajax="false" />
                </h:panelGrid>
            </h:form>
        </p:panel>
    </body>
</f:view>    
</html>  

alterarCategoria.jsp
O alterarCategoria é praticamente idêntico ao inserirCategoria, o que muda é o botão de Salvar pois a action passa a ser #{categoriaBean.alterar}, mas mesmo assim segue o código:
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<%@ taglib uri="http://primefaces.prime.com.tr/ui" prefix="p" %>
<html>
<f:view>
    <head>
        <title>Alterar Categoria</title>
        <p:resources />
    </head>
    <body>
        <p:growl id="aviso" />
    
        <p:panel header="Alterar Categoria" style="width: 320px" >
            <h:form>
                <h:panelGrid columns="2">
                    <h:outputText value="Nome" />
                    <h:inputText value="#{categoriaBean.categoria.nome}" required="true" requiredMessage="Informe o nome" />
                    <h:outputText value="Valor" />
                    <h:inputText value="#{categoriaBean.categoria.valor}" required="true" requiredMessage="Informe o valor" />
                    <h:outputText value="Data" />
                    <p:calendar value="#{categoriaBean.categoria.data}" pattern="dd/MM/yyyy" locale="pt_BR" required="true" requiredMessage="Informe a data" />
                    <p:commandButton value="Salvar" action="#{categoriaBean.alterar}" update="aviso" ajax="false" />
                    <p:commandButton value="Cancelar" action="cancelar" immediate="true" ajax="false" />
                </h:panelGrid>
            </h:form>
        </p:panel>
    </body>
</f:view>    
</html>  

removerCategoria.jsp

Código-Fonte:
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<%@ taglib uri="http://primefaces.prime.com.tr/ui" prefix="p" %>
<html>
<f:view>
    <head>
        <title>Remover Categoria</title>
        <p:resources />
    </head>
    <body>
            <p:panel header="Remover Categoria" style="width: 400px" >
            <h:form>
                <h:outputText value="Confirma remoção da categoria: #{categoriaBean.categoria.nome} ?" />
                <h:panelGrid columns="2">
                    <p:commandButton value="Sim" action="#{categoriaBean.remover}" ajax="false" />
                    <p:commandButton value="Não" action="cancelar" immediate="true" ajax="false" />
                </h:panelGrid>
            </h:form>
        </p:panel>
    </body>
</f:view>    
</html>  

Para finalizar, o faces-config.xml deve ter essa estrutura de navegação:

24 de outubro de 2010

JavaEE 5: Configuração do PrimeFaces em páginas JSP

Informações: JSF 1.2, PrimeFaces 1.1: Clique para baixar o PrimeFaces 1.1

Porque não utilizar a versão que está no site do PrimeFaces?
Pois a versão que está no site para baixar é para o JSF 2.0, causando assim uma incompatibilidade de versões, atualmente a versão mais atualizada para o JSF 1.2, realmente é a 1.1.

Configurando..
Nessa configuração estou levando em consideração que já tenha um JSF Project criado, caso não saiba como criar: Clique aqui...
Depois de baixar o .jar do PrimeFaces, coloque o mesmo dentro da pasta lib em WebContent - WEB-INF - lib.
Para utilizar o PrimaFaces é necessário configurar a servlet do mesmo no web.xml, então neste insira o seguinte código:
  <servlet>
   <servlet-name>Resource Servlet</servlet-name>
   <servlet-class>org.primefaces.resource.ResourceServlet</servlet-class>
  </servlet>
  <servlet-mapping>
   <servlet-name>Resource Servlet</servlet-name>
   <url-pattern>/primefaces_resource/*</url-pattern>
  </servlet-mapping> 

Agora dentro do WebContent crie um JSP File com o nome que desejar. Para que o PrimeFaces funcione corretamente, é necessário adicionar a seguinte tagLib:
<%@ taglib uri="http://primefaces.prime.com.tr/ui" prefix="p" %>

Além da tagLib é necessário ter outra configuração básica:
<head>
    <p:resources />
</head>

Enfim... uma página JSP precisa ter a seguinte estrutura para funcionar corretamente:
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<%@ taglib uri="http://primefaces.prime.com.tr/ui" prefix="p" %>

<html>
<f:view>
    <head>
        <p:resources />
    </head>
    <body>
        
    </body>
</f:view>    
</html>  

Para testar se está tudo funcionando, faça um teste com algum componente do PrimeFaces, por exemplo p:editor. Então, a partir da estrutura acima, coloque o seguinte codigo dentro das tags body e /body
<p:editor />

Resultado no navegador:


Caso não apareça este componente, reveja as configurações, pois pode estar faltando alguma coisa. ;)


Links:
http://www.primefaces.org/

Componentes do PrimeFaces (Obs: alguns componentes mostrados podem não conferir com a versão utilizada nesta postagem)
http://www.primefaces.org/showcase/ui/home.jsf

18 de outubro de 2010

JavaEE 5: CRUD em JSF 1.2

Na postagem de hoje iremos fazer um CRUD - uma aplicação simples com as seguintes operações: Create(criar ou inserir), Retrieve(recuperar ou listar), Update(atualizar) e Delete(remover). Antes de começar vamos refrescar a memória: JavaServer Faces ...

Criando o projeto
No Eclipse crie um novo 'JSF Project' como no link acima e coloque o nome de ProjetoJsf. Segue a estrutura do projeto:

 
Nesse post não iremos implementar os pacotes model e dao, estes serão reutilizados das postagens anteriores: Parte I e Parte II, de acordo com esses links implemente as classes: Categoria.java, Conexao.java e Categoria_DAO.java, quanto a essa última classe, ela está implementada em partes nas duas postagens, então garanta que ela tenha os seguintes métodos: inserir, listar, selecionar, alterar e remover
Depois de feito isso, vamos criar nosso pacote  control onde guardamos nossos beans. Nesse caso teremos apenas um bean chamado CategoriaBean.java, a implentação desse bean é o seguinte:
public class CategoriaBean {
    //Atributos
    private Categoria categoria = new Categoria();
    private List<Categoria> categorias;

    //Métodos
    public String nova(){
        categoria = new Categoria();
        
        return "inserir";
    }
    
    public String inserir(){
        Categoria_DAO dao = new Categoria_DAO();
        return dao.inserir(categoria);
    }
    
    public void selecionar(int codigo){
        Categoria_DAO dao = new Categoria_DAO();
        categoria = dao.selecionar(codigo);
    }
    
    public String alterar(){
        Categoria_DAO dao = new Categoria_DAO();
        return dao.alterar(categoria);
    }
    
    public String remover(){
        Categoria_DAO dao = new Categoria_DAO();
        return dao.remover(categoria.getCodigo());
    }
    
    //Getters e Setters
    
    public Categoria getCategoria() {
        return categoria;
    }

    public void setCategoria(Categoria categoria) {
        this.categoria = categoria;
    }

    public List<Categoria> getCategorias() {
        Categoria_DAO dao = new Categoria_DAO();
        categorias = dao.listar();
        return categorias;
    }

    public void setCategorias(List<Categoria> categorias) {
        this.categorias = categorias;
    }
    
}

Alguns métodos são claros, criam uma Categoria_DAO e chamam suas operações correspondentes. Perceba que não há passagem do objeto Categoria por parâmetro nos métodos do bean, pois através dos getter's e setter's eles são teoricamente "injetados" dentro do bean ao dar um submit em um form de uma página JSF (talvez isso não tenha ficado muito claro, mas vou tentar esclarecer no decorrer da implementação).
Depois de implementar o bean, vamos mapeá-los no faces-config.xml com escopo de sessão:
<managed-bean>
  <managed-bean-name>categoriaBean</managed-bean-name>
  <managed-bean-class>control.CategoriaBean</managed-bean-class>
  <managed-bean-scope>session</managed-bean-scope>
 </managed-bean>

Dentro do WebContent crie as seguintes JSP's com o template de JSFBasePage:
* inserirCategoria.jsp
* categorias.jsp
* alterarCategoria.jsp
* removerCategoria.jsp
* falha.jsp
Por enquanto podem ser vazios mesmo, no faces-config.xml, faça o seguinte diagraḿa, onde alguns redirecionamentos dependem do que o bean retornar (explicado em sala de aula):


Segue agora apenas os códigos dos JSF's:
inserirCategoria.jsp
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<html>
    <head>
        <title>Inserir Categoria</title>
    </head>
    <body>
        <f:view>
            <h:form>
            <h:panelGrid columns="3">
                <h:outputText value="Nome" />
                <h:inputText value="#{categoriaBean.categoria.nome}" required="true" requiredMessage="Informe o nome" id="nome" />
                <h:message for="nome" style="color: red;" />
                <h:commandButton value="Salvar" action="#{categoriaBean.inserir}" />
                <h:commandButton value="Cancelar" action="cancelar" immediate="true" />
            </h:panelGrid>    
            
            </h:form>
            
        </f:view>
    </body>    
</html>  

categorias.jsp
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<html>
    <head>
        <title>Categorias</title>
    </head>
    <body>
        <f:view>
            <h:form>
                <h:commandButton value="Nova" action="#{categoriaBean.nova}" />
            </h:form>
            
            <h:dataTable value="#{categoriaBean.categorias}" var="c"  >
                <h:column>
                    <f:facet name="header"><h:outputText value="Codigo" /></f:facet>
                    <h:outputText value="#{c.codigo}" />
                </h:column>
                <h:column>
                    <f:facet name="header"><h:outputText value="Nome" /></f:facet>
                    <h:outputText value="#{c.nome}" />
                </h:column>
                <h:column>
                    <f:facet name="header"><h:outputText value="Ações" /></f:facet>
                    <h:form>
                        <h:commandButton value="Alterar" actionListener="#{categoriaBean.selecionar(c.codigo)}" action="alterar" />
                        <h:commandButton value="Remover" actionListener="#{categoriaBean.selecionar(c.codigo)}" action="remover" />
                    </h:form>
                </h:column>
            </h:dataTable>
            
        </f:view>
    </body>    
</html>  

alterarCategoria.jsp
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<html>
    <head>
        <title>Alterar Categoria</title>
    </head>
    <body>
        <f:view>
            <h:form>
            <h:panelGrid columns="3">
                <h:outputText value="Nome" />
                <h:inputText value="#{categoriaBean.categoria.nome}" required="true" requiredMessage="Informe o nome" id="nome" />
                <h:message for="nome" style="color: red;" />
                <h:commandButton value="Salvar" action="#{categoriaBean.alterar}" />
                <h:commandButton value="Cancelar" action="cancelar" immediate="true" />
            </h:panelGrid>    
            </h:form>
        </f:view>
    </body>    
</html>  

removerCategoria.jsp
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<html>
    <head>
        <title>Remover Categoria</title>
    </head>
    <body>
        <f:view>
            <h:outputText value="Confirma a remoção da categoria: #{categoriaBean.categoria.nome} ?" />
            <h:form> 
                <h:commandButton value="Sim" action="#{categoriaBean.remover}" />
                <h:commandButton value="Não" action="cancelar" immediate="true" />
            </h:form>
        </f:view>
    </body>    
</html>  

falha.jsp
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>

<html>
    <head>
        <title></title>
    </head>
    <body>
        <f:view>
            <h:outputText value="Ocorreu um erro..." />
        </f:view>
    </body>    
</html>  

Até a próxima! =)

Baixar projeto

5 de outubro de 2010

JavaEE 5: JavaServer Faces 1.2

JavaServer Faces... o que é?
É um framework MVC para o desenvolvimento de aplicações Web criado pela Sun, que permite o desenvolvimento de aplicações para a internet de forma visual, ou seja, arrastando e soltando os componentes na tela (em páginas JSP, quando utilizado sem outros frameworks, por exemplo: JBoss Seam), definindo as propriedades dos mesmos. (Wikipédia)
Atualmente está  na versão 2.0, porém trabalharemos com a versão anterior: 1.2.

Iniciando...
Tendo todo o Eclipse configurado de acordo com as primeiras aulas, vamos criar um Projeto JSF. Para isso, no Eclipse, vá em: File - New - JSF Project, coloque o nome de HelloJsf.

 A estrutura final do projeto será esta:


Vamos começar a montar esta estrutura. Primeiramente crie um pacote chamado control dentro de JavaSource, nele vamos guardar nossos beans... mas o que são beans?(não, não são feijões!) ... Beans no JEE5 não está bem definido, então podemos dizer que estes são: classes que armazenam e retornam valores (com getters e setters), mas podem ter outras definições também.
Então, vamos criar uma classe chamada Teste.java, esta será um bean!
Teste.java:
public class Teste {

    public String texto = "Ola mundooo";

    public String getTexto() {
        return texto;
    }

    public void setTexto(String texto) {
        this.texto = texto;
    }    
}

Esse bean será acessado em nossa página JSP, mas como isso vai ocorrer? Bom... se olharem a imagem da estrutura (acima) verão que dentro do webContent - WEB-INF temos um arquivo faces-config.xml, neste arquivo nossos beans são mapeados para poderem ser "enxergados" pela nossa JSP.
Então... o código do nosso faces-config.xml vai ficar da seguinte forma:
<?xml version="1.0" encoding="UTF-8"?>
<faces-config version="1.2" xmlns="http://java.sun.com/xml/ns/javaee"
 xmlns:xi="http://www.w3.org/2001/XInclude"
 xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-facesconfig_1_2.xsd">
 
 <managed-bean>
  <managed-bean-name>teste</managed-bean-name>
  <managed-bean-class>control.Teste</managed-bean-class>
  <managed-bean-scope>session</managed-bean-scope>
 </managed-bean>
</faces-config>
Explicando...
managed-bean-name: nome de acesso no JSP.
managed-bean-class: localização da classe, [pacote.classe]
managed-bean-scope: escopo deste bean.

Os escopos podem ser: 
request: o bean sobrevive apenas durante a chamada de um método, depois de executado o mesmo "morre" (menor tempo de vida de um bean).
session: o bean sobrevive durante toda a sessão, por exemplo: quando se faz um login e se quer armazenar os dados de um usuário, este escopo dura mais que um request e menos que um application.
application: o bean sobrevive enquanto a aplicação estiver ativa, ou seja, tempo de vida de um bean com escopo application é maior que um bean com escopo de session.

Continuando...
Depois de termos mapeado nosso bean Teste, vamos criar no webContent uma página JSP (JSP File) coloque o nome de resultado.jsp e selecione a opção de Template: JSFBasePage, para que esta já venha com as taglibs do JSF.
Informe o seguinte código:
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<html>
    <head>
        <title></title>
    </head>
    <body>
        <f:view>
            <h:outputText value="#{teste.texto}" />            
        </f:view>
    </body>    
</html>  
Bom... toda a sintaxe será explicada com a partir do código da próxima página que será feita.
O resultado desta página será apenas um texto que foi inicializado no nosso bean, neste caso será um: "Ola mundooo".
Então vamos continuar criando uma nova página JSP, da mesma forma que a página anterior, mas com o nome de index.jsp
Nosso index.jsp irá ficar com o seguinte código:
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<html>
    <head>
        <title></title>
    </head>
    <body>
        <f:view>
            <h:form>
                <h:outputText value="nome" />
                <h:inputText value="#{teste.texto}" />
                <h:commandButton value="Enviar" action="salvar" />
            </h:form>
        </f:view>
    </body>    
</html>  
Veja que as tags do JSF são diferentes das tags HTML, para utilizar daquelas é necessário informar as taglibs do JSF que são as duas primeiras linhas do código acima. a tag h:outputText é uma forma de inserir um texto na página, h:inputText é um campo de texto e o h:commandButton é um botão. Perceba que como value do h:inputText estamos setando o seguinte valor: #{teste.texto}
O resultado desta página no navegador é a seguinte:


Analise o código em negrito:
#{teste.texto} é utilizada para acessarmos nossos beans...
#{teste.texto} é nosso bean mapeado no faces-config.xml
#{teste.texto} é nossa String do bean teste, este valor se referencia tanto ao set como ao get, por isso é apenas texto e não getTexto() e setTexto().

Agora analisando o h:commandButton:
a action é o que nosso botão vai executar, neste caso, ele não estará executando nenhum método do nosso bean, apenas estará submetendo o h:form que setará o valor do texto no bean, e redirecionará para a página resultado.jsp.
Como isso será feito? Chamamos isso de navegação ou pageflow. Mapeamos esta navegação no faces-config.xml (isto mesmo, no mesmo arquivo em que são mapeados nossos beans), essa navegação pode ser feita tanto por código como de forma visual.
Código a ser adicionado no faces-config.xml (adicionar logo depois do mapeamento do bean, mas ainda dentro da tag que fecha o faces-config)
<?xml version="1.0" encoding="UTF-8"?>
<faces-config version="1.2" xmlns="http://java.sun.com/xml/ns/javaee"
 xmlns:xi="http://www.w3.org/2001/XInclude"
 xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-facesconfig_1_2.xsd">
 
 <!-- Aqui fica nosso bean teste mapeado -->
 
 <navigation-rule>
  <from-view-id>/index.jsp</from-view-id>
  <navigation-case>
   <from-outcome>salvar</from-outcome>
   <to-view-id>/resultado.jsp</to-view-id>
  </navigation-case>
 </navigation-rule>
</faces-config>
Entendendo a lógica da navegação pelo código:
from-view-id: vamos dizer que esta é a nossa página de partida.
navigation-case: seria onde ficariam as respostas do que a view index.jsp poderá retornar a partir da propriedade action do h:commandButton.
from-outcome: é a resposta da action. Caso esta action fosse a chamada de um método, ele levaria em consideração o return do método. Mas neste exemplo estamos dando uma resposta diretamente que é "salvar".
to-view-id: é pra onde deve redirecionar a página caso a resposta seja "salvar".

Ou... visualmente:

Explicando a numeração da imagem:
1. Serve para criar uma view, para isso, clique na "folhinha" e clique na área de criação do diagrama, ao fazer isso, ele dá a opção de procurar onde a página jsp se encontra, selecione a mesma e clique em finish. Faça isso para as duas páginas (index.jsp e resultado.jsp).
2. Serve para criar a navegação entre elas, para isso, clique na "setinha preta" e clique primeiramente na index.jsp (pois é de onde irá partir nossa resposta) e logo depois clique em resultado.jsp. Ao fazer isso, ele criará a navegação tendo como padrão o nome da página para onde será redirecionado (neste caso a resposta por padrão é: resultado), para alterar a resposta, clique duas vezes em cima da palavra "resultado", assim abrirá uma janela com as configurações da navegação, apenas altere a propriedade "From Outcome" para "salvar" que é a resposta que será dada pela index.jsp na action do h:commandButton.

Para testar a aplicação, acesse: http://localhost:8080/HelloJsf/index.jsf
Isso mesmo, é .jsf ... pois na configuração padrão do web.xml de um JSF Project é .jsf, caso deseje trocar a extensão, procure a linha que se referencia a: url-pattern no web.xml!

Assim finalizamos um simples exemplo de uma aplicação em JSF, mas pode ter certeza: o melhor do JSF ainda está por vir! ;-)

Referências


JavaServer Faces API
http://download.oracle.com/docs/cd/E17802_01/j2ee/javaee/javaserverfaces/1.2_MR1/docs/tlddocs/index.html

Primefaces: Componentes JSF
http://www.primefaces.org/

20 de setembro de 2010

JavaEE 5: CRUD com JSP e Servlet - Parte II

Continuando a aula do dia 18/08/2010, vamos implementar o alterar e o remover de nossas categorias.
Altere a página index.jsp, para que ela fique com o seguinte código:

Depois de salvar as alterações o resultado é o seguinte:
Perceba que foram adicionados dois links: um para a página alterarCategoria.jsp e outro para a removerCategoria.jsp, ambos passando o código da categoria por parâmetro na própria URL. Porém essas páginas ainda não estão criadas, então vamos começar a criar e implementar as mesmas.

Implementando o alterar:

Inicialmente vamos alterar nossa classe Categoria_DAO.java, incluindo nela os métodos para selecionar a categoria pelo código da mesma, e o método de alterar a categoria:
Obs.: o método selecionar(int codigo), será reutilizado quando for implementado o remover.

Dentro do pacote control, crie um Servlet com o nome de AlterarCategoria.java, implemente o método doPost como a imagem abaixo:


Dentro do WebContent crie uma nova página JSP, com o nome de alterarCategoria.jsp, lembre-se que a action do form, é nosso servlet AlterarCategoria.java:
Ao clicar em Alterar no index.jsp, o resultado será este (perceba que o código da categoria sendo passado por parâmetro na URL):

Estando assim finalizado os passos para alterar nossa categoria.

Implementando o remover:

Novamente vamos começar alterando a classe Categoria_DAO.java, para incluir o método remover:
Dentro do pacote control, crie um Servlet com o nome de RemoverCategoria.java, implemente o método doPost como a imagem abaixo:

Dentro do WebContent crie uma nova página JSP, com o nome de removerCategoria.jsp, lembre-se que a action do form, é nosso servlet RemoverCategoria.java:

Ao clicar em Remover no index.jsp, o resultado será este (perceba que o código da categoria sendo passado por parâmetro na URL):

Estando assim finalizado os passos para remover nossa categoria.

15 de setembro de 2010

JavaEE 5: CRUD com JSP e Servlet - Parte I

Este é um exemplo de uma inserção de uma categoria qualquer...
Com o eclipse todo configurado(aula do dia 04/08/2010), vamos criar um projeto web:
No Eclipse vá em File - New - Dynamic Web Project

Depois de criar o projeto, vamos configurar a aplicação para conectar ao banco de dados MySQL, para que isso ocorra precisaremos do driver JDBC para MySQL encontrado em: http://dev.mysql.com/downloads/connector/j/ 
Agora vamos adicionar o driver ao projeto:


Explicando a imagem acima:
1. Clique com o botão direito do mouse sobre o projeto criado, e já em "Properties"
2. Na janela que vai aparecer, clique em "Java Build Path"
3. Já para a aba "Libraries"
4. Clique em "Add External JARs"
5. Localize o driver JDBC que foi baixado, e o selecione
6. Clique em "OK"


Explicando a outra imagem:
1. Verifique que o .jar tenha sido adicionado as bibliotecas
2. Confirme a operação clicando em "OK"

Bom... agora já temos nosso projeto configurado para acessar o banco de dados!
No MySQL vamos criar um database chamado "tads", dentro deste uma tabela chamada Categoria, segue o codigo SQL:
create table Categoria (
codigo int(10) unsigned not null auto_increment,
nome varchar(45), primary key (codigo))
Esta será a estrutura final deste projeto:

1. Temos o projeto ProjetoJsp, Dentro de "Java Resources: src" temos os pacotes: control, model e dao
2. No pacote control, guardamos nossos servlets
3. No pacote dao, guardamos tudo o que é relacionado ao banco de dados, ex: o arquivo Conexao.java (responsável por fazer a conexão com o BD)
4. No model, encontramos nossas classes de modelo.
5. A pasta WebContent é a pasta onde ficam nossos arquivos .jsp, esses são os arquivos que o usuário tem acesso.

Agora vamos iniciar a implementação do mesmo...
1. dentro de "Java Resources: src" criamos  um pacote model, dentro dela criamos uma classe Categoria.java.

Nela temos os atributos codigo e nome, lembre-se de implementar os getters e setters...

2. dentro de "Java Resources: src" criamos  um pacote  dao, dentro dele criamos uma classe Conexao.java, que será nosso arquivo de conexão com o BD.

Neste arquivo temos atributos como: driver, url, usuario e senha.

public Conexao() - este é o construtor da nossa classe Conexao.java, quando fazemos new Conexao(); estaremos executando este método, que está sendo responsável por criar a conexão com o banco;
public Connection getConn() - método para pegar a conexão;
public void fecharConexao() - sempre que uma conexão for aberta, depois de fazermos as operações que desejamos, devemos fechá-la;

3. Agora ainda dentro do pacote dao, criaremos uma nova classe Categoria_DAO.java

Nesta classe criamos inicialmente dois métodos:
public String inserir(Categoria categoria) - método que insere a categoria no banco de dados.
public List listar() - método responsável por carregar  e retornar uma lista de categorias, será utilizada para mostrar as categorias inseridas.

4. dentro de "Java Resources: src" criamos mais um pacote chamado control, onde ficarão nossos servlets. Agora vamos criar o servlet InserirCategoria.java, para isso: clique com o botão direito do mouse no pacote control - new - Servlet .
Apenas o método doPost será implementado, como na imagem acima.

5. Na pasta WebContent vamos criar agora nossa página JSP para inserir a categoria: Clique com o botão direito do mouse na pasta WebContent - new - JSP, informe o nome inserirCategoria.jsp

Implemente o inserirCategoria.jsp de acordo com a imagem acima, ao ser criado pelo eclipse, várias informações já vem presentes nela, então, o que realmente será implementado é o form.

6. Ainda no WebContent vamos criar nossa página incial, do mesmo jeito que foi criado a página inserirCategoria.jsp, crie uma página index.jsp

Esta deve ser implementada como a imagem acima, fique atento aos detalhes.
Observe que existem umas tags <% , estas são utilizadas para colocar códigos Java dentro de nossas páginas JSP's.

Executando nossa aplicação: 
Lembre-se de adicionar o projeto no JBoss, o mesmo deve estar como a imagem abaixo:

Caso não esteja assim, clique com o botão direito em JBoss 6.0 Runtime Server - Add and Remove - Selecione o projeto e clique em add.
Inicie o JBoss, depois de iniciado, digite no navegador : 
http://localhost:8080/ProjetoJsp
o resultado deverá ser o seguinte:

Obs: a tabela aparecerá vazia, neste caso já haviam dados no banco.

Ao clicar no link de Inserir Categoria na página index.jsp, a mesma deverá aparecer:
Ao inserir uma categoria com sucesso, a página é retornada para a index.jsp.

Bom... este é o básico para aplicações web com java!

Obs: caso ocorra alguma exceção do tipo ClassNotFoundException relacionada ao JDBC, cole o mesmo driver JDBC utilizado na aplicação dentro do seu servidor de aplicação: jboss-6.0.0 - server - default - deploy

=)

10 de setembro de 2010

JavaEE 5: Ambiente de trabalho

Como servidor de aplicação usaremos o JBoss: é um dos servidores de aplicações mais completos, também é capaz de trabalhar com as tecnologias mais modernas e possui frameworks incorporados a sua distribuição(ex: JSF e Hibernate, estes serão utilizados mais a diante).
Para trabalhar com Java EE, utilizaremos a ferramenta de desenvolvimento Eclipse, que possui um pluguin que controla as funcionalidades do nosso servidor de aplicação JBoss, este pluguin é o JBoss Tools.
Como gerenciador de banco de dados, será utilizado o MySQL, ferramenta gratuita e de fácil manipulação.
Os links para configuração das ferramentas acima citadas estão disponíveis abaixo:
*Lembrando que para desenvolvermos em Java é necessário o JDK.
Passo a passo para baixar o JDK:

Passo a passo para baixar o Eclipse:

Passo a passo para baixar o JBoss:

Passo a passo da instalação do JBoss Tools:

Configuração do JBoss no Eclipse :

Tutorial de instalação do MySQL:

Créditos dos tutoriais de instalação:
Ivan Salvadori

Mais informações:
Introdução Java Web

5 de setembro de 2010

JavaEE: Servlets

Quando se trata do desenvolvimento de aplicações web em linguagem de programação Java, deve-se conhecer os servlets, pois os mesmos são a base nesse tipo de desenvolvimento. Esta tecnologia, é a base para outra tecnologia Java, conhecida como JavaServer Pages (será estudada na próxima aula). De forma mais simples, os servlets são classes que dinamicamente processam requisições(request) e respostas(response).


Benefícios
As aplicações desenvolvidas em tecnologia servlet, ganham em desempenho, pois os mesmos não são criados todas as vezes em que o usuario os solicitam, isso quer dizer que depois de solicitado uma vez, o servlet permanece na memória esperando uma nova solicitação.
Outra vantagem é a portabilidade, isso já vem da própria plataforma Java. Aplicações web em Java rodam em outros sistemas operacionais sem problema.
Por ser uma tecnologia Java, o desenvolvimento com servlets tem um rápido ciclo de desenvolvimento, devido a rica biblioteca do Java.
Com aplicações que são gerenciadas pela Java Virtual Machine não há porque o desenvolvedor se preocupar com o gerenciamento de memória, pois esta possui um "coletor de lixo" que é executado de tempos em tempos eliminando objetos que perderam a referência na memória, liberando assim mais memória para a execução do sistema. Tornando assim um sistema mais robusto.
Além da linguagem Java ter uma ampla aceitação no mercado, tanto é que inúmeros fabricantes trabalham com tecnologias baseadas em Java.
Lembrando os conceitos da aula anterior...
*Request: são requisições feitas ao servlet, representada por exemplo, pelo submit de um formulário.
*Response: são respostas dadas à requisições feitas ao servlet. Um servlet recebe um request, trata o mesmo e retorna um response.
*método doGet: Este é chamado quando uma solicitação HTTP é enviada através do método GET. Lembrando que GET é o método padrão em HTTP, sendo assim quando o servlet é chamado pela primeira vez a partir de um brower da web, digitando-o na URL, o método doGet é executado.
*método doPost: Quando um formulário é submetido utilizando o método POST e enviado a um servlet, este executa o método doPost para tratar os dados enviados.

O arquivo web.xml
Serve como um descritor das funcionalidades e caracteristicas da sua aplicação. Ele determina como os servlets são mapeados para os URLs, ou seja, é a partir desse mapeamento que o servlet pode ser acessado pelo navegador, sem este mapeamento não é possível ter acesso ao servlet.
Segue trecho do mapeamento de um servlet: Hello.java


Explicando as tags...
servlet : definindo o servlet;
display-name : nome de visualização do servlet;
servlet-name : nome do servlet;
servlet-class : localização da classe;
servlet-mapping : mapeando o servlet para ser acessado pela URL;
url-pattern : URL pela qual o servlet será acessado, exemplo: http://localhost:8080/MeuProjeto/Hello

Exemplo de implementação do servlet Hello.java:


Resultado no navegador:




Depois dos conceitos, iremos praticar o que foi visto!


Referências
KURNIAWAN, B. Java para a Web com Servlets, JSP e EJB. Ciência Moderna, 2002.

1 de setembro de 2010

JavaEE: Conceitos básicos

Aplicações Web
Aplicações desse tipo são executadas a partir de navegadores de Internet (ex: Internet Explorer, Firefox...). Não necessitam de instalação na maquina dos clientes, são instaladas e executadas em servidores. Isso facilita na atualização e na manutenção do código fonte, já que o mesmo fica num único lugar, e ao ser atualizado essa atualização fica disponível na mesma hora para todos os usuários.

Aplicação Desktop X Aplicação Web
Uma aplicação Desktop geralmente tem no mesmo lugar, a visualização e a lógica, sendo assim o processamento fica todo na maquina cliente, podendo compartilhar um servidor de banco de dados.
Tratada como arquitetura de software two-tiers.


Uma aplicação Web tem sua visualização e lógica divididas, ou seja: a visualização fica disponível a maquina cliente, e a lógica é processada em um servidor de aplicação. Tratada como arquitetura de software multi-tiers ou n-tiers.


Servidor de Aplicação
Trata-se de um software que dispõe de um ambiente de instalação e execução de certas aplicações, tem como objetivo abstrair do desenvolvedor algumas das complexidades de um sistema computacional. Por exemplo: JBoss, GlassFish...

Java Enterprise Edition
Trata-se de um conjunto de especificações e um guia de práticas para o desenvolvimento de aplicações web, em linguagem de programação Java. Essas especificações juntamente com o guia permitem o desenvolvimento, instalação, execução e gerenciamento de aplicações n-tiers ou n-camadas no servidor. É uma plataforma completa, robusta, estável, segura e de alta performance.

Servlets
Pertencem a plataforma Java EE. São basicamente classes que dinamicamente processam requisições e respostas. Os principais pontos a ser entendido de um servlet são: request, response, método doGet e método doPost.
Request: são requisições feitas a servlet, representada por exemplo, pelo submit de um formulário.
Response: são respostas dadas à requisições feitas ao servlet. Um servlet recebe um request, trata o mesmo e retorna um response.
doGet: Este é chamado quando uma solicitação HTTP é enviada através do método GET. Lembrando que GET é o método padrão em HTTP, sendo assim quando o servlet é chamado pela primeira vez a partir de um browser da web, digitando-o na URL, o método doGet é executado.
doPost: Quando um formulário é submetido utilizando o método POST e enviado a um servlet, este executa o método doPost para tratar os dados enviados.

JavaServer Pages (JSP)
É uma tecnologia para aplicações web em plataforma Java, bem similar a PHP, ASP, entre outras linguagens voltadas a web. Uma das vantagens desta linguagem é a portabilidade por causa da plataforma Java. Os arquivos são salvos em extensão .jsp .(Mais utilizada na versão do JEE 5)