Arquivos de sites

Parte 7 (Final) – Tutorial de Ajax no Struts 2 com Exemplo

Bem vindo a ultima parte de uma série de 7 artigos de tutoriais do Framework Struts2, no artigo anterior nós vimos como implementar a funcionalidade de carga de arquivo (File Upload) no Struts2. Neste artigo nós vamos ver como nós podemos implementar o suporte Ajax em uma aplicação web usando o framework struts2.

Suporte AJAX no Struts 2

O Struts 2 fornece  suporte embutido a Ajax usando a biblioteca Dojo Toolkit. Se você é novo em Dojo, talvez você queira passar pela Introdução ao DOJO Toolkit (Em Inglês).

O Struts 2 vem com um poderoso conjunto de APIs de Dojo AJAX que você pode usar para adicionar suporte Ajax. A fim de adicionar suporte Ajax, você precisa adicionar o seguinte arquivo JAR no seu classpath:
struts2-dojo-plugin.jar

Uma vez que nós adicionamos esse arquivo JAR, nós precisamos adicionar o seguinte fragmento de código em qualquer arquivo JSP que nós precisamos adicionar o suporte Ajax.

<%@ taglib prefix="sx" uri="/struts-dojo-tags"%>

Primeiro defina a taglib sx que nós usaremos para adicionar as tags disponíveis de AJAX.

<sx:head/>

Adicione essa tag head no seu JSP entre as tags <head> … </head>. Essa tag sx:head incluirá os arquivos javascript e css necessários pra implementar o Ajax.

Exemplo AJAX: Ajax Drop Down (Combobox)  do Struts2

Vamos adicionar um simples suporte AJAX a nossa aplicação web StrutsHelloWorld. Nós usaremos o código base que nós usamos nos artigos anteriores e adicionar o Ajax no topo dele.

Nós criaremos um drop down (combobox) qual irá autocompletar e sugerir a entrada. Para isso nós iremos adicionar o suporte Dojo a nossa app web.

Passo 1: Adicionar o arquivo JAR

Como discutido anteriormente nós adicionaremos o struts2-dojo-plugin.jar no classpath (WEB-INF/lib). Assim, a seguinte é a lista dos arquivos JAR necessários. Observe que estes jars são necessários para rodar toda a aplicação, incluindo todos os exemplos das partes anteriores desta série de tutoriais.
struts2-ajax-jar-files

Passo 2: Criar a classe action do AJAX

Nós vamos criar uma classe action a qual irá ser chamada pelo nosso exemplo Ajax. Crie um arquivo AjaxAutocomplete.java no pacote net.viralpatel.struts2 e copie o seguinte conteúdo dentro dele.

AjaxAutocomplete.java

package net.viralpatel.struts2;

 

import java.util.ArrayList;

import java.util.List;

import java.util.StringTokenizer;

 

import com.opensymphony.xwork2.ActionSupport;

 

public class AjaxAutocomplete extends ActionSupport {

    private String data = "Afghanistan, Zimbabwe, India, United States, Germany, China, Israel";

    private List<String> countries;

    private String country;

    

    public String execute() {

        countries = new ArrayList<String>();

        StringTokenizer st = new StringTokenizer(data, ",");

 

        while (st.hasMoreTokens()) {

            countries.add(st.nextToken().trim());

        }

        return SUCCESS;

    }

    public String getCountry() {

        return this.country;

    }

 

    public List<String> getCountries() {

        return countries;

    }

 

    public void setCountries(List<String> countries) {

        this.countries = countries;

    }

    public void setCountry(String country) {

        this.country = country;

    }

}

No código acima nós criamos uma simples classe action com os atributos String country e List countries. A lista de países será populada com nomes de países quando o método execute() é chamado. Aqui por exemplo, nós carregamos dados estáticos. Você pode se sentir livre para mudar isso e adicionar dados do banco de dados.

Passo 3: Crie o JSP

Crie o arquivo JSP para exibir o Textbox com Autocomplete para nossa action Ajax. Crie AjaxDemo.jsp no diretório WebContent.

AjaxDemo.jsp

<%@ page contentType="text/html; charset=UTF-8"%>

<%@ taglib prefix="s" uri="/struts-tags"%>

<%@ taglib prefix="sx" uri="/struts-dojo-tags"%>

<html>

<head>

    <title>Welcome</title>

    <sx:head />

</head>

<body>

    <h2>Struts 2 Autocomplete (Drop down) Example!</h2>

    

    Country:

    <sx:autocompleter size="1" list="countries" name="country"></sx:autocompleter>

    </action>

</body>

</html>

No arquivo JSP acima nós usamos a tag sx:autocompleter para renderizar um drop down com autocomplete o qual utiliza a classe Ajax para buscar dados internamente. Veja que nós mapeamos o atributo list com List countries.

Passo 4: Criando a entrada no Struts.xml

Adicione a seguinte entrada de action no arquivo Struts.xml:

<action name="ajaxdemo" class="net.viralpatel.struts2.AjaxAutocomplete">

    <interceptor-ref name="loggingStack"></interceptor-ref>

    <result name="success" type="tiles">/ajaxdemo.tiles</result>

    <result type="tiles">/ajaxdemo.tiles</result>

</action>

Observe que nós estamos utilizando Tiles aqui neste exemplo. Você pode querer usar o AjaxDemo.jsp ao invés do /ajaxdemo.tiles para renderizar a saída diretamente em JSP.

Isso é tudo pessoal

Compile e rode a aplicação no eclipse
struts2-ajax-drop-down

Download do código fonte

Clicque aqui para fazer o download do código fonte sem os JARs (24KB)

Conclusão

O framework Struts2 fornece uma ampla variedade de recursos para criar uma rica aplicação web. Nessa série de Struts2 nós vimos diferentes aspectos do Struts2 como introdução ao struts2, aplicação hello world, framework de validação, plugin tiles, interceptadores do struts2, carga de arquivo e suporte a Ajax.

Fonte: viralpatel.net – Viral Patel

Parte 6 – Tutorial de Upload e Gravação de Arquivos do Struts 2 com Exemplo

Bem vindos a parte 6 de uma série de 7 partes do framework Struts2. Na parte anterior nós passamos pelo básico dos Interceptadores do Struts2. Também criamos um interceptador customizado e o integramos a aplicação Struts2.

É bastante recomendável passar pelos artigos anteriores no caso de você ser novo no framework Struts2.

Hoje vamos ver como fazer um Upload de Arquivos no Struts2. Nós vamos utilizar o interceptador FileUploadInterceptor que vem embutido no Struts2, no nosso exemplo para fazer o upload do arquivo. O interceptador de upload de arquivos do Struts2 é baseado no MultiPartRequestWrapper, o qual é automaticamente aplicado a requisição se ela contém um elemento de arquivo.

Arquivo JAR Necessário

Antes de começar, você precisa ter certeza que o arquivo commons-io.jar está presente no classpath. Segue a lista de arquivos JAR necessários.
struts2-file-upload-jar-files

Primeiros passos

A fim de adicionar a funcionalidade de upload de arquivos, nós vamos adicionar uma classe action FileUploadAction ao nosso projeto. Crie o arquivo FileUploadAction.java no pacote net.viralpatel.struts2
FileUploadAction.java

package net.viralpatel.struts2;

 

import java.io.File;

import javax.servlet.http.HttpServletRequest;

import org.apache.commons.io.FileUtils;

import org.apache.struts2.interceptor.ServletRequestAware;

import com.opensymphony.xwork2.ActionSupport;

 

public class FileUploadAction extends ActionSupport implements

        ServletRequestAware {

    private File userImage;

    private String userImageContentType;

    private String userImageFileName;

 

    private HttpServletRequest servletRequest;

 

    public String execute() {

        try {

            String filePath = servletRequest.getSession().getServletContext().getRealPath(“/”);

            System.out.println("Server path:" + filePath);

            File fileToCreate = new File(filePath, this.userImageFileName);

 

            FileUtils.copyFile(this.userImage, fileToCreate);

        } catch (Exception e) {

            e.printStackTrace();

            addActionError(e.getMessage());

 

            return INPUT;

        }

        return SUCCESS;

    }

 

    public File getUserImage() {

        return userImage;

    }

 

    public void setUserImage(File userImage) {

        this.userImage = userImage;

    }

 

    public String getUserImageContentType() {

        return userImageContentType;

    }

 

    public void setUserImageContentType(String userImageContentType) {

        this.userImageContentType = userImageContentType;

    }

 

    public String getUserImageFileName() {

        return userImageFileName;

    }

 

    public void setUserImageFileName(String userImageFileName) {

        this.userImageFileName = userImageFileName;

    }

 

    @Override

    public void setServletRequest(HttpServletRequest servletRequest) {

        this.servletRequest = servletRequest;

 

    }

}

No arquivo da classe acima, nós declaramos alguns atributos:

  • private File userImage; -> Isso irá armazenar o arquivo carregado
  • private String userImageContentType; -> Essa string conterá o Content Type do arquivo carregado.
  • private String userImageFileName; -> Essa string irá conter o nome do arquivo carregado.

Os campos userImageContentType e userImageFileName são opcionais. Se o método setter desse campos for fornecido, o Struts2 irá setar o dado. Isso é apenas para pegar alguma informação extra do arquivo carregado. Segue também o padrão de nomeação, se você fornecer o tipo do conteúdo e o nome do arquivo. O nome deve ser ContentType e FileName. Por exemplo, se o atributo arquivo (File) na action for private File uploadedFile, o tipo do conteúdo será uploadedFileContentType e o nome do arquivo uploadedFileFileName.

Observe também na classe action acima, nós implementamos a interface org.apache.struts2.interceptor.ServletRequestAware. Isto é para pegar o objeto servletRequest. Nós estamos usando esse path para salvar o arquivo carregado no método execute(). Nós usamos o método FileUtil.copyFile() do pacote commons-io para copiar o arquivo carregado na pasta root. Esse arquivo será recuperado na página JSP e exibido ao usuário.

Os JSPs

Crie dois arquivos JSP na pasta WebContent. UserImage.jsp irá exibir um formulário para o usuário carregar a imagem. Ao submeter, o arquivo será carregado e salvo no servidor. O usuário será enviado ao arquivo SuccessUserImage.jsp aonde terá os detalhes do arquivo serão exibidos. Copie o seguinte código dentro dele.
UserImage.jsp

<%@ page contentType="text/html; charset=UTF-8"%>

<%@ taglib prefix="s" uri="/struts-tags"%>

<html>

<head>

<title>Upload User Image</title>

</head>

 

<body>

<h2>Struts2 File Upload & Save Example</h2>

<s:actionerror />

<s:form action="userImage" method="post" enctype="multipart/form-data">

    <s:file name="userImage" label="User Image" />

    <s:submit value="Upload" align="center" />

</s:form>

</body>

</html>

SuccessUserImage.jsp

<%@ page contentType="text/html; charset=UTF-8"%>

<%@ taglib prefix="s" uri="/struts-tags"%>

<html>

<head>

<title>Success: Upload User Image</title>

</head>

<body>

    <h2>Struts2 File Upload Example</h2>

    User Image: <s:property value="userImage"/>

    <br/>

    Content Type: <s:property value="userImageContentType"/>

    <br/>

    File Name: <s:property value="userImageFileName"/>

    <br/>

    Uploaded Image:

    <br/>

    <img src="<s:property value="userImageFileName"/>"/>

</body>

</html>

Entrada no Struts.xml

Adicione a seguinte entrada da classe FileUploadAction  ao arquivo struts.xml.

<action name="userImage"

    class="net.viralpatel.struts2.FileUploadAction">

    <interceptor-ref name="fileUpload">

        <param name="maximumSize">2097152</param>

        <param name="allowedTypes">

            image/png,image/gif,image/jpeg,image/pjpeg

        </param>

    </interceptor-ref>

    <interceptor-ref name="defaultStack"></interceptor-ref>

    <result name="success">SuccessUserImage.jsp</result>

    <result name="input">UserImage.jsp</result>

</action>

Observe que na entrada acima nós especificamos dois parâmetros ao interceptador fileUpload, maximumSize e allowedTypes. Estes são parâmetros opcionais que nós podemos especificar ao interceptador. O parâmetro maximumSize setará o tamanho máximo do arquivo que poderá ser carregado. Por padrão é 2MB. E o parâmetro allowedTypes especifica os tipos de conteúdos permitidos do arquivo que será carrregado. Aqui nós o especificamos para ser um arquivo de imagem (image/png,image/gif,image/jpeg,image/pjpeg).

O interceptador de carga de arquivo também faz a validação e adiciona erros, essas mensagens de erros são armazenadas dentro do arquivo struts-messsages.properties. Os valores das mensagens podem ser sobrescritos fornecendo texto/valor para as seguintes chaves:

  • struts.messages.error.uploading – erro quando a carga do arquivo falha
  • struts.messages.error.file.too.large – erro ocorrido quando o tamanho do arquivo é grande
  • struts.messages.error.content.type.not.allowed – quando o tipo do conteúdo não é permitido

Isso é tudo pessoal

Compile e execute o projeto no eclipse e vá ao link http://localhost:8080/StrutsHelloWorld/UserImage.jsp

Tela de carga de imagem
struts2-file-upload-example

Tela de carga de imagem no caso de erro
struts2-file-upload-error

Tela de carga de imagem em sucesso
struts2-file-upload-success

Download do código fonte

Clique aqui para fazer o download do código fonte sem os JARs (20KB)

Fonte: viralpatel.net – Viral Patel

Parte 3 – Tutorial do Framework de validação do Struts2 com Exemplo

Seja bem vindo a parte 3 de uma série de 7 partes do tutorial aonde vamos passar por diferentes aspectos práticos do framework Struts2. Na última parte nós criamos uma Aplicação básica de Struts2 do zero. Eu recomendo fortemente que você passe pelos artigos anteriores no caso de você ser novo no Struts2.

Nesse artigo vamos aprender como alavancar o framework de validação do Struts2 em uma aplicação. Para isso utilizaremos a aplicação StrutsHelloWorld a qual nós criamos no artigo anterior como base e começaremos adicionando a lógica de validação a ele.

Introdução ao framework de validação do Struts2

A action do Struts2 depende de um framework de validação fornecido pela XWork para permitir a aplicação de regras de validação de entrada para nossa Action antes delas serem executadas. O framework de validação do Struts2 nos permite separar a lógica de validação do real código Java/JSP, onde isso pode ser revisado e facilmente modificado depois.

O framework de validação do Struts2 alivia muita das dores de cabeça associadas com  manipulação de validação de dado, permitindo você focar no código de validação e não no mecanismo de captura de dados e reexibição de dados incompletos ou inválidos.

O framework de validação vem com um conjunto de retinas úteis para manipular o formulário de validação automaticamente e isso pode tratar o formulário de validação de ambos os lados, servidor (Server Side) ou cliente (Client Side). Se determinada validação não está presente, você pode criar sua própria lógica de validação implementando a interface com.opensymphony.xwork2.Validator e plugá-la dentro do framework de validação como um componente reutilizável.

O validador usa arquivos de configuração XML para determinar quais rotinas de validação devem ser instaladas e quais delas devem ser aplicadas para uma determinada aplicação.O arquivo validators.xml contém todas as declarações dos validadores comuns. Se o arquivo validators.xml não estiver presente no classpath, um arquivo de validação padrão é carregado do path com/opensymphony/xwork2/validator/validators/default.xml.

O primeiro arquivo de configuração, declara as rotinas de validação que devem ser plugadas dentro do framework e fornece nomes lógicos para cada uma das validações. O arquivo validator-rules.xml também define o código JavaScript do lado cliente para cada rotina de validação. O validador pode ser configurado para enviar esse código JavaScript para o navegador então essas validações são realizadas tanto do lado cliente quanto do lado servidor.

Escopo dos Validadores (Validators Scope)

Temos 2 tipos de validadores na Validação do Struts2.

  1. Field Validators (Validação de Campos)
  2. Non-field validators (Validação de Não-Campos)

Field validators, como o nome indica, atua em um único campo acessível através de uma action. Um validador, em contrapartida, é mais genérico e pode fazer validações no contexto inteiro da action, invocando mais de um campo (ou até mesmo nenhum campo) na regra de validação. A maioria das validações podem ser definidas em forma de campo. Isso deve ter preferência sobre validação non-field sempre que possível, como mensagens de validação de campo são vinculados ao campo relacionado e será apresentado próximo ao elemento de entrada correspondente na view respectiva.

<validators>

  <field name="bar">

      <field-validator type="required">

          <message>You must enter a value for bar.</message>

      </field-validator>

  </field>

</validators>

Non-field validators apenas adiciona mensagens de nível de action. Validações non-field fornecida pela XWork é ExpressionValidator (Validador de Expressão).

<validators>

      <validator type="expression">

            <param name="expression">foo lt bar</param>

            <message>Foo must be greater than Bar.</message>

      </validator>

</validators>

Primeiros passos

Vamos adicionar a lógica de validação na aplicação StrutsHelloWorld que nós criamos no artigo anterior. Para esse tutorial, vamos criar uma classe Action chamada CustomerAction a qual conterá poucos campos. Crie um arquivo CustomerAction.java no pacote net.viralpatel.struts2.
customer-action-struts2

Copie o seguinte conteúdo dentro dele.

CustomerAction.java

package net.viralpatel.struts2;

import com.opensymphony.xwork2.ActionSupport;

public class CustomerAction extends ActionSupport{

    private String name;

    private Integer age;

    private String email;

    private String telephone;

    public String addCustomer() {

        return SUCCESS;

    }

    

    public String getName() {

        return name;

    }

    public void setName(String name) {

        this.name = name;

    }

    public Integer getAge() {

        return age;

    }

    public void setAge(Integer age) {

        this.age = age;

    }

    public String getEmail() {

        return email;

    }

    public void setEmail(String email) {

        this.email = email;

    }

    public String getTelephone() {

        return telephone;

    }

    public void setTelephone(String telephone) {

        this.telephone = telephone;

    }

}

Observe que a classe CustomerAction tem os campos name, email, telephone e age. Também tem um método chamado addCustomer() o qual não tem nenhuma lógica, ele apenas retorna SUCCESS.

Agora nós vamos adicionar uma entrada para essa classe action no arquivo struts.xml. Abra o arquivo struts.xml o qual estará presente abaixo da pasta resources. E adicione o seguinte conteúdo entre as tags <package></package>.

<action name="customer"

    class="net.viralpatel.struts2.CustomerAction">

    <result name="success">SuccessCustomer.jsp</result>

    <result name="input">Customer.jsp</result>

</action>

Observe que nós estamos mapeando a classe CustomerAction com o nome customer. Também em sucesso o usuário será redirecionado a página SuccessCustomer.jsp. Repare que tem outra tag de resultado com nome input. Sempre que a lógica de validação encontra algum erro de validação, redireciona o usuário de volta a página especificada como input. Assim no nosso exemplo, o usuário será redirecionado de volta para Customer.jsp no caso de quaisquer erros.

Crie duas novas JSPs Customer.jsp (qual conterá o formulário do Customer) e SuccessCustomer.jsp (qual será mostrada em sucesso).
struts2-validation-jsp-files

Customer.jsp

<%@ page contentType="text/html; charset=UTF-8"%>

<%@ taglib prefix="s" uri="/struts-tags"%>

<html>

<head>

<title>Customer Form - Struts2 Demo | ViralPatel.net</title>

</head>

<body>

<h2>Customer Form</h2>

<s:form action="customer.action" method="post">

    <s:textfield name="name" key="name" size="20" />

    <s:textfield name="age" key="age" size="20" />

    <s:textfield name="email" key="email" size="20" />

    <s:textfield name="telephone" key="telephone" size="20" />

    <s:submit method="addCustomer" key="label.add.customer" align="center" />

</s:form>

</body>

</html>

SuccessCustomer.jsp

<%@ page contentType="text/html; charset=UTF-8"%>

<%@ taglib prefix="s" uri="/struts-tags"%>

<html>

<head>

<title>Customer Page - Struts2 Demo | ViralPatel.net</title>

</head>

<body>

    <h2>Customer Added Successfully.</h2>

</body>

</html>

Nós criamos o arquivo Customer.jsp qual irá exibir o formulário Customer. Mas nós não temos link para esta página na nossa aplicação web. Então nós criaremos um link para Customer.jsp da página Welcome.jsp. Abra a página Welcome.jsp e adicione o seguinte código de link dentro dela.

<s:a href="Customer.jsp">Add Customer</s:a>

Agora abra o arquivo ApplicationResources.properties da pasta resources e adicione as seguintes chaves/valores dentro dela.

name= Name

age= Age

email= Email

telephone= Telephone

label.add.customer=Add Customer

errors.invalid=${getText(fieldName)} is invalid.

errors.required=${getText(fieldName)} is required.

errors.number=${getText(fieldName)} must be a number.

errors.range=${getText(fieldName)} is not in the range ${min} and ${max}.

Execute o código no Eclipse e veja a saida. Você verá a página de login. Entre com username=admin e a senha=admin123 e faça o login. Na página de boas vindas você verá um link para página Add Customer. Clique naquele link e você verá a página Customer.
struts2-customer-form

Adicionando a lógica de validação

Agora nós terminamos o básico do formulário customer no qual nós vamos adicionar a lógica de validação. Seguem as regras de validações:

  1. Campo Name é obrigatório.
  2. Campo Age é obrigatório. Deve ser um número entre 1 e 100.
  3. Campo Email é obrigatório. Deve ser um endereço de email válido.
  4. Campo Telephone é obrigatório.

A fim de definir a lógica de validação para um formulário em particular, primeiro nós devemos criar um arquivo XML no qual manterá esse dado. O Struts2 define uma convenção de nomenclatura específica na definição dos arquivos XML de validação. O formato é <NomeDaClasseAction>-validation.xml. Então para nossa aplicação vamos criar um arquivo CustomerAction-validation.xml. Observe que este arquivo deve estar presente no mesmo pacote da classe action.
Crie o arquivo
CustomerAction-validation.xml no pacote net.viralpatel.struts2. E copie o seguinte conteúdo dentro dele.
struts2-validation-xml

CustomerAction-validation.xml

<!DOCTYPE validators PUBLIC "-//Apache Struts//XWork Validator 1.0.3//EN"

    "http://struts.apache.org/dtds/xwork-validator-1.0.3.dtd">

<validators>

    <field name="name">

        <field-validator type="requiredstring">

            <param name="trim">true</param>

            <message key="errors.required" />

        </field-validator>

    </field>

    <field name="age">

        <field-validator type="required">

            <message key="errors.required" />

        </field-validator>

        <field-validator type="int">

            <param name="min">1</param>

            <param name="max">100</param>

            <message key="errors.range"/>

        </field-validator>

    </field>

    <field name="email">

        <field-validator type="requiredstring">

            <message key="errors.required" />

        </field-validator>

        <field-validator type="email">

            <message key="errors.invalid" />

        </field-validator>

    </field>

    <field name="telephone">

        <field-validator type="requiredstring">

            <message key="errors.required" />

        </field-validator>

    </field>

</validators>

E é isso. Nós apenas adicionamos a lógica de validação ao nosso exemplo. Veja que os arquivos XML de validação contém diferentes field-validators.

Validação do lado cliente

É muito fácil adicionar a validação do lado cliente ou validação JavaScript a qualquer formulário em Struts2. Tudo o que você precisa fazer é adicionar validate=”true” na tag form no seu arquivo JSP. Por exemplo abra o Customer.jsp e adicione validate=”true” na tag form. O Struts2 automaticamente gerará o código JavaScript para validação do lado cliente do formulário.

<s:form action="customer.action" method="post" validate="true">

    ...

</s:form>

Isso é tudo pessoal

Execute a aplicação e teste o formulário Customer com diferentes valores.

Página Customer

struts2-customer-form

Página Customer com erros
customer-page-validation-errors

Página Customer com sucesso
customer-page-success

Download do Código Fonte

Struts2_Validation_example.zip (3.6 MB)

Fonte: viralpatel.net – Viral Patel