Mostrando postagens com marcador Spring. Mostrar todas as postagens
Mostrando postagens com marcador Spring. Mostrar todas as postagens

Tecnologia -> Desenvolvimento -> JAVA -> Eclipse -> Spring IDE no Eclipse

Spring IDE no Eclipse

Nesse Post mostrarei duas formas de ter o plugin Spring IDE no Eclipse:
Primeira forma é baixando a IDE já com suporte nativo:
SpringSource Tool Suite (STS) é uma IDE baseada no Eclipse com plugins pré-instalados que fornece recursos valiosos para os desenvolvedores Spring. Além do suporte para o framework Spring core, STS também oferece editores visuais, validadores, Painel do Spring para outros projetos como Spring ROO, Grails, Groovy, Gradle, tcServer, e Insight Spring.
O plugin principal para STS é Spring IDE, que fornece as características fundamentais de ferramentas Spring.  STS  vem pré-configurado com muitos outros plugins, como M2Eclipse  para  Maven,  Web Tools Platform (WTP), Data Tools Platform (DTP), AspectJ  Development Tools (AJDT) e ferramentas JUnit. Já vem incluso também a edição de desenvolvedor do vFabric tc Server, o substituto para o Apache Tomcat, que vem otimizada para Spring.
STS está disponível a partir do site SpringSource:
http://www.springsource.com/developer/sts
Após o download é só proceder à instalação:
Mac OS:
É preciso montar a imagem de disco, clicando duas vezes sobre o arquivo dmg baixado. Abra o volume chamado ‘SpringSource’ e ​​dê um duplo clique no instalador para iniciar a instalação. Siga as instruções na tela para concluir a instalação.
Windows:
Dê um duplo clique no instalador para iniciar o processo de instalação. Siga as instruções na tela para concluir a instalação.
Se você baixou o arquivo ZIP, não use o utilitário de extração que vem com o Windows isso está causando problemas durante a extração. Em vez disso,use o utilitário livre 7-Zip, recomendado no próprio site.
Linux:
Uma vez baixado, iniciar a instalação, executando o seguinte comando em um terminal:
1
sh nomeDoArquivoBaixado.sh
Maiores informações referentes à instalação podem ser encontradas no próprio site.
Segunda forma, baixando o plugin Eclipse IDE:
O plugin prove facilidades para o uso de Spring. Possui auto complete para os xmls de configuração do Spring, módulo visual para o Spring Web Flow, navegação entre os beans do Spring, e visualização de recursos AOP.
Instalação:
No Eclipse, clique em “Help –> Install New Software…”para abrir a caixa de diálogo de instalação do plugin.

No segundo passo clique no botão Add. da imagem acima, na tela que abrirá digite “Spring IDE” sem as aspas no campo name, e “http://springide.org/updatesite” no campo Location e clique em OK.


Aguarde o Eclipse buscar os softwares, depois selecione apenas os campos acima e clique em Next, após isso basta aceitar os termos e aguardar pelo fim da instalação.
Para gerenciar os sites dos plugins clique em Help -> Install New Software …  Clicando no link “Available Software Sites” você vai ver os sites dos plugins configurados no momento.

Fonte: http://www.springsource.com/developer/sts

Tecnogia -> Informática -> Tutorial -> Tomcat -> Configurando o Eclipse para usar Tomcat o Spring Framework

Configurando o Eclipse para usar Tomcat o Spring Framework

Agosto 10, 2008

Nunca parece ser bastante documentação sobre como criar Spring Framework projetos habilitados no Eclipse . É amplamente utilizado para aplicações web o que você precisa saber é como integrar oTomcat e o Eclipse - Segue abaixo um passo-a-passo das instruções para fazer exatamente isso.

Eu não vou descrever como instalar o Java Runtime Environment . Se precisar de ajuda com isso, então utilize os serviços de busca como google, yahoo, bing , etc.

Instalação
No Windows todas as instalações serão localizadas em c:\java em vez de c:\Arquivos de programas . Você vai economizar-se uma dor de cabeça enorme tentando descobrir por que o Windows não interpretou as linhas de comando corretamente se você acabou de remover a causa do problema.

  1. Download Eclipse IDE for Java EE Developers 3,4 Ganymede dos downloads seção do site da Eclipse.
  2. Extraia o eclipse-jee-ganymede-win32.zip em c:\Java\eclipse .
  3. Criar um atalho para o executável do Eclipse, para o lançamento fácil.
  4. Baixar Tomcat 6.x do downloads seção do site web Tomcat.Você vai precisar de ter a base pack (Core) e não o pacote do Windows Installer. O pacote do Windows Installer não inclui alguns dos scripts de linha de comando para o lançamento do Tomcat.
  5. Extraia o apache-tomcat-6.0.18.zip em c: \ java \ apache-tomcat-6.0.18 , em seguida, renomeá-lo para c: \ java \ tomcat .
  6. Lançamento Eclipse.
  7. Em uma nova instalação do Eclipse ele te perguntar onde você quer colocar o seu espaço de trabalho. Vamos colocá-lo em c: \ java \ workspace porque a questão espaços serão um problema se ele vai para c: \ Documents and Settings \ David Newcomb \ workspace .
  8. Em seguida vamos instalar o nosso plugin de Primavera IDE , instruções completas sobre como fazer isso estão na minha página do blog, intitulada Eclipse 3.4 Ganymede e Spring IDE 2.0.6 .
  9. Após a instalação ele diz que É altamente recomendável que você reiniciar seu sistema para que as alterações tenham efeito. .. Reiniciar agora? , quando ele diz que sistema significa que a bancada eclipse e não todo o seu computador, então clique em Sim .

Configure Tomcat dentro do Eclipse
Em seguida nós precisamos dizer Eclipse sobre o qual estamos usando Tomcat e configurar a integração.

  1. A partir da barra de menus selecione Janela> Preferências- .
  2. A Preferências janela será aberta. Expandir servidor .
  3. Destaque Runtime Environment . Este é o lugar onde você pode dizer sobre o Eclipse onde você coloca a sua instalação do Tomcat.
  4. Clique Adicionar .
  5. Expandir Apache e selecione Apache Tomcat v6.0 .
  6. Verifique o Criar um novo servidor local caixa de seleção para criar um novo servidor nos servidores vista.
  7. Clique em Avançar .
  8. Deixe o nome do servidor definido para Apache Tomcat v6.0 .
  9. Eclipse dá a opção de baixar uma versão do Tomcat, mas geralmente não tem a última versão (que é por isso que nós baixado separadamente). Clique Procurar e navegue até c: \ java \ tomcat e clique em Ok .
  10. Deixe o JRE suspensa definido para Workbench JRE padrão .
  11. Clique em Concluir .
  12. Você é levado de volta para o Server Runtime Environmentspágina de preferências então clique OK .
  13. Um novo projeto terá sido criado e se você entrar noServidores view (no conjunto de fundo de guias), você verá um novo servidor Apache Tomcat v6.0 em localhost .

Criar projeto
Existem vários diferentes tipos de projeto no Eclipse e precisamos o que nos permitirá integrar todas as coisas que precisamos.

  1. Selecione File-> New-> Project Web Dinâmico
  2. Digite um Projeto de nome. Embora você pode ter espaços, na minha opinião, é melhor não colocar qualquer polegadas O nome do projeto torna-se o nome do diretório e pela mesma razão acima é uma dor se houver espaços.
  3. O Runtime alvo já deve estar definido para Apache Tomcat v6.0 .
  4. Também manter a configuração definida para padrão de configuração para o Apache Tomcat v6.0 .
  5. Clique em Concluir .
  6. No Project Explorer , clique direito sobre o novo projeto e selecione Primavera Ferramentas-> Adicionar Nature Projeto Primavera .

Spring Web do projeto e do projeto Tomcat associação
Devemos agora associar o projeto com Tomcat.

  1. Certifique-se a servidores vista é visível (no conjunto de fundo de guias). Destaque seu novo projeto da Web da Primavera e arrastá-lo para o servidor Tomcat v6.0 em localhost entrada no Servidores guia.
  2. Queremos usar o servidor Tomcat, quando usamos o nosso novo projeto, para que possamos definir o servidor de projeto a ser uma dependência do nosso novo projeto. Isto significa que quando abrimos o nosso projeto do Servidor do projeto será aberta automaticamente.
  3. Clique direito sobre o nosso projeto e selecione Propriedades .
  4. Selecione o Projeto Referências opção e verificar a servidoresdo projeto.
  5. Clique Ok .

Informática -> Spring -> AppFuse Struts2 Tutorial with Eclipse / SpringSource Tools Suite

AppFuse Struts2 Tutorial with Eclipse / SpringSource Tools Suite

Excerpt from AppFuse's website:

AppFuse is an open source project and application that uses open source tools built on the Java platform to help you develop Web applications quickly and efficiently. It was originally developed to eliminate the ramp-up time found when building new web applications for customers. At its core, AppFuse is a project skeleton, similar to the one that's created by your IDE when you click through a wizard to create a new web project.

AppFuse builds on Maven to accomplish its goal. AppFuse + Maven can be used command line, creating our application with just a single line; but here we will be using Eclipse.

In this tutorial we'll go through the creation of a simple Struts2 web-application, which we'll extend later. We'll use SpringSource Tools Suite 2.2.1 (STS) which is a free tool based on Eclipse 3.5.1 with a pre-configured set of plugins useful for web-development. STS has the Maven2 plugin which we'll use to configure AppFuse for us.

So, grab a copy of SpringSource Tools from http://www.springsource.com/products/sts. After the installation, select File->New->Project... Type maven, and click Next:



Leave "Use default Workspace location" checked and click Next.



Enter struts in the filter, and select struts2-archetype-starter. This is a so called "Maven Archetype", a ready-to-be-used project template built around the Project Object Model (POM), which will create a starter application for Apache Struts 2.0. Click Next.



Now enter the following info:
  • Group Id: org.techmissive
  • Artifact Id: testdrive-struts
  • Version: 1.0.0
  • Package: org.techmissive.testdrive.struts
And click "Finish":



We have created our template project. Now Eclipse (I mean STS of course) will start downloading all our dependencies, and build the project for us. On OSX, we can see directly the Maven-log; on Windows we have to open the Console view (Alt+Shift+Q then C), and click the down-arrow next to the Open Console button on its toolbar (the window-like button left of the green lamp) and select Maven console to see what Maven is doing.



Included with this template is Jetty, a lightweight servlet container, which can be used to test our application locally without installing a full blown J2EE Server. Let's see how we can start it from STS.

Select Run -> Run Configurations... from the Menu, here we'll specify what happens when we start our application. Select 'Maven Build' from the list, and click on the New icon on the top of the window to create a new configuration.



To set the Base directory, click on Browse Workspace. Now click on testdrive-struts and OK. This sets ${workspace_loc:/testdrive-struts} in the Base directory field, which is a relative resolution from our workspace location.

To run Jetty, we have to run a given goal, so enter jetty:run-war in the goals field.

Replace the New_configuration default name with something more meaningful, like Run Jetty.



Click Apply to save, and Run to start the configuration we just created.

Now Eclipse is working again, starts to download all kind of stuff. But in the end proudly confirms the successful starting of Jetty:



Let's test if it works. Jetty is listening by default on the port 8080, so let's start a browser and check what is there. Start Safari and enter http://localhost:8080/testdrive-struts in the address field:



We have a running Web-application and we didn't have to write a single line of code. This is the main purpose of AppFuse: to provide us a skeleton application we can start working on without hours of hunting for the libraries, configuring them, etc. I just wish all the profiles would work the first time like this one...

Informática -> JSON - SPRING

JSON + Spring

Como já citado algumas vezes aqui no blog (como aqui e aqui), é possível trabalhar com JSON e Spring. Você pode produzir dados em formato JSON dos controllers do framework, facilitando a manipulação da informação na página.

Mas como fazer isso?

Para isso, utilizamos a lib json-lib-ext-spring. Existem outras alternativas (biblioteca/lib), mas particularmente achei esse mais fácil e menos trabalhosa.

Não esqueça de fazer o download da Json-lib e suas dependências.

Após o donwload e adição no buildPath do projeto, apenas é preciso fazer algumas pequenas modificações:

A primeira é acrescentar um arquivo chamado views.xml ao diretório do WEB-INF com o seguinte conteúdo:

jsonSpring01

O segundo é adicionar o conteúdo seguinte ao arquivo de configuração do Spring:

jsonSpring02

Lembre-se de setar uma ordem se você estiver utilizando algum outro view resolver.

Com essas alterações efetuadas, basta utilizar “jsonView” como o viewname e o model será convertido para json quando voltar para o cliente:

jsonSpring03

Em breve, um tutorial de como construir um grid em Ext JS utilizando json + spring.

Fonte: http://www.loiane.com/2009/07/json-spring/

Informática -> Spring + ExtJS - Grid Print

Impressão de GRID no EXTJS com GridPrinter


O Grids é um dos componentes Ext JS mais utilizados, e geralmente representam dados/informações que o usuário gostaria de imprimir (como relatórios, por exemplo). Como o grid usualmente é parte de uma aplicação maior (não apenas contém o grid na página), apenas imprimir a página (Ctrl + P) não é uma boa solução, pois é feita apenas a impressão das informações que cabem na página de impressão (e o grid pode conter barras de rolagem, e estas, sairão na página impressa).

Uma outra solução para impressão de grids, seria construir uma outra página HTML ou JSP, contendo apenas as informações que serão impressas. Mas teríamos que fazer uma requisição ao servidor, buscar os dados e renderezar uma nova página. Pra que então utilizar o ExtJs Grid, se você vai fazer tudo na mão novamente. Dobro de trabalho.

Recentemente em um projeto, passe por essa situação, então comecei a buscar no Oráculo uma solução. Encontrei duas. Uma vai ser apresentada neste post, e a outra apresentarei no próximo post.

A primeira solução, com GridPrinter, gera uma página em HTML apenas com as informações do Grid. Porém com uma diferença: o GridPrinter é um plugin Third Party (de terceiros) para o ExtJS, ou seja, não preciso fazer uma requisição ao servidor para renderizar uma nova página. Este plugin, obtém as informações do próprio grid, e gera a página para a impressão, em outra palavras, tudo é feito via javascript/ExtJS, todo o trabalho fica no lado cliente (browser), o que torna a solução bem leve.

Só tem um porém: como o GridPrinter pega os dados que estão renderizados na página, se você tiver um Grid com paginação, as únicas informações que serão impressas são aquelas que o usuário está visualizando.

Vamos ao código:

Construindo o Grid

Primeiro, precisamos configurar o grid. Vamos adicionar um botão na barra de tarefas (top tool bar – tbar) que irá chamar o script que irá construir a página HTML que servirá para impressão:

01//checkboxes
02 var sm = new Ext.grid.CheckboxSelectionModel();
03
04 // cria o grid
05 var grid = new Ext.grid.GridPanel({
06 store: store,
07 columns: [
08 sm,
09 {header: "NOME", width: 170, sortable: true, dataIndex: 'nome'},
10 {header: "TELEFONE", width: 150, sortable: true, dataIndex: 'telefone'},
11 {header: "EMAIL", width: 150, sortable: true, dataIndex: 'email'},
12 {header: "DATA NASC.", width: 100, sortable: true, dataIndex: 'aniversario',
13 renderer: Ext.util.Format.dateRenderer('d/m/Y')},
14 {header: "ENDEREÇO", width: 200, sortable: true, dataIndex: 'endereco'},
15 ],
16 sm:sm,
17 title: 'Impressão Grid Extjs',
18 autoHeight:true,
19 width:800,
20 renderTo: document.body,
21 frame:true,
22 tbar : [
23 {
24 text : 'Imprimir',
25 handler: function() {
26 Ext.ux.GridPrinter.print(grid);
27 }
28 }
29 ]
30 });

Depois precisamos configuar a página HTML que chamará o script:

01<html>
02<head>
03<title>Impressão Grid ExtJs com GridPrintertitle>
04
05
06 <link rel="stylesheet" type="text/css" href="/gridPrinter-extjs/js/extjs/resources/css/ext-all.css" />
07 <script src="/gridPrinter-extjs/js/extjs/adapter/ext/ext-base.js">script>
08 <script src="/gridPrinter-extjs/js/extjs/ext-all.js">script>
09
10
11 <script src="/gridPrinter-extjs/js/gridPrinter/Ext.ux.GridPrinter.js">script>
12
13
14 <script src="/gridPrinter-extjs/js/grid.js">script>
15
16head>
17<body>
18 <div id="impressao-grid">div>
19body>
20html>

Fazendo o Setup do Plugin – GridPrinter

Você pode fazer o download do GridPrinter – versão original aqui.

Além do arquivo javascript, você precisa adicionar o arquivo de estilos (css):

01html,body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,
02th,td{margin:0;padding:0;}
03img,body,html{border:0;}address,caption,cite,code,dfn,em,strong,var{font-style:normal;font-weight:normal;}
04ol,ul {list-style:none;}
05caption,th {text-align:left;}
06h1,h2,h3,h4,h5,h6{font-size:100%;}
07q:before,q:after{content:'';}
08
09table {
10 width: 100%;
11 text-align: left;
12 font-size: 11px;
13 font-family: arial;
14 border-collapse: collapse;
15}
16
17table th {
18 padding: 4px 3px 4px 5px;
19 border: 1px solid #d0d0d0;
20 border-left-color: #eee;
21 background-color: #ededed;
22 font-weight:bold;
23}
24
25table td {
26 padding: 4px 3px 4px 5px;
27 border-style: none solid solid;
28 border-width: 1px;
29 border-color: #ededed;
30}

Fique à vontade para modificar o css, afinal o gosto é do cliente! :)

Além disso, você precisa dizer ao GridPrinter em que lugar está o arquivo CSS:

1/**
2 * @property stylesheetPath
3 * @type String
4 * The path at which the print stylesheet can be found
5 */
6stylesheetPath: '/gridPrinter-extjs/js/gridPrinter/resources/gridPrinter.css',

Fiz algumas mudanças no arquivo original. As mudanças são simples de fazer, basta você entender um pouco da lógica utilizando, e é claro, saber o básico de ExtJS. Você pode conferir as pequenas mudanças que fiz fazendo o download no GitHub.

Resultado

O Grid:

grid_printer_extjs_01

A página de impressão:

grid_printer_extjs_03

Bem melhor do que apenas dá um Ctrl P!

Excluindo a coluna CheckBox da página de impressão

Se você não utilizar o Checkbox, você não vai ver esse símbolo “{}” na primeira coluna. Mas se tiver usando, pode ser que não queira colocar esse símbolo na sua página de impressão, talvez você quer que apareça apenas os dados.

Para retirar essas chaves, basta fazer uma pequena modificação no código do GridPrinter, ou seja, como o GridPrinter pega as configurações do ColumnModel, precisamos apenas excluir a primeira coluna, que é o sm (CheckBox):

1var columns_ = grid.getColumnModel().config;
2var columns = [];
3for (var i=1;i
4 columns[i-1] = columns_[i];
5}

E o resultado:

grid_printer_extjs_02

Você pode baixar o projeto completo no GitHub: http://github.com/loiane/gridPrinter-extjs

Fonte: http://www.loiane.com/2009/11/impressao-de-grid-no-extjs-com-gridprinter/

Informática -> Spring + ExtJS - Grid CRUD

ExtJS e Spring Framework: Exemplo de um CRUD Grid

Este tutorial demonstra como implementar um CRUD Grid (Create, Read, Update, Delete) usando ExtJS e Spring Framework

O que geralmente queremos fazer com os dados

  • Create (Criar) – (Insert)
  • Read (Ler/Visualizar) – (Select)
  • Update (Atualizar) – (Update)
  • Delete (Deletar) – (Delete)

Até a versão 3.0 do ExtJS, podíamos apenas LER dados utilizando o componente dataGrid. Se você quisesse fazer um update, insert ou delete, você tinha que codificar funções específicas para essas ações no lado ExtJS. Com a versão 3.0 (e versões mais recentes) do ExtJS, a biblioteca javascript introduziu o ext.data.writer, e você não tem todo aquele trabalho de criar as funções específicas, pode utilizar o Writer para ter um CRUD Grid.

Mas o que é preciso para ter todas as funcionalidades funcionando apenas com o uso desse writer?

No exemplo desse tutorial, estou usando JSON como formato de dados para troca de informações entre brwoser e servidor.

Primeiro, é preciso criar um Ext.data.JsonWriter:

1// The new DataWriter component.
2 var writer = new Ext.data.JsonWriter({
3 encode: true,
4 writeAllFields: false
5 });

Onde writeAllFields significa que queremos enviar todos os campos do registro para o banco de dados. identifies that we want to write all the fields from the record to the database. Se você tem uma estrutura de dados um pouco complicada ou o usuário irá fazer muitas iterações de update, é melhor deixar setado como false.

Por exemplo, Essa é a declaração da minha estrutura de dados no ExtJS:

01var Contact = Ext.data.Record.create([
02{name: 'id'},
03{
04 name: 'name',
05 type: 'string'
06}, {
07 name: 'phone',
08 type: 'string'
09}, {
10 name: 'email',
11 type: 'string'
12}, {
13 name: 'birthday',
14 type: 'date',
15 dateFormat: 'm/d/Y'
16}]);

Se eu apenas atualizar o nome do contato, a aplicação irá apenas enviar o nome do contato e a id do mesmo para o servidor dizendo que foi atualizado (se o campo writeallfields estiver como false). Se tiver setado como true, irá enviar todos os campos, e o trabalho para descobrir o que sofreu alteração ficará para o server.

Agora, é necessário configurar o proxy, como esse:

1var proxy = new Ext.data.HttpProxy({
2 api: {
3 read : 'contact/view.action',
4 create : 'contact/create.action',
5 update: 'contact/update.action',
6 destroy: 'contact/delete.action'
7 }
8});

E só para constar, é assim que meu reader se parece:

1var reader = new Ext.data.JsonReader({
2 totalProperty: 'total',
3 successProperty: 'success',
4 idProperty: 'id',
5 root: 'data',
6 messageProperty: 'message' // <-- New "messageProperty" meta-data
7},
8Contact);

O próximo passo é juntat tudo (writer, proxy e reader) no objeto store:

1// Typical Store collecting the Proxy, Reader and Writer together.
2 var store = new Ext.data.Store({
3 id: 'user',
4 proxy: proxy,
5 reader: reader,
6 writer: writer, // <-- plug a DataWriter into the store just as you would a Reader
7 autoSave: false // <-- false would delay executing create, update, destroy requests until specifically told to do so with some [save] buton.
8 });

O autosave significa que deseja salvar as alterações automaticamente no servidor (não precisa de um botão salvar na tela, assim que o usuário atualizar, deleter ou criar um novo dado, será enviado automaticamente para o servidor). Para este exemplo, implementei um botão salvar, assim, qualquer registro ou dado que for adicionado ou alterado terá uma marcação vermelha (no canto superior esquerdo da célula), assim quando o evento (ou botão) salvar for disparado, serão enviados para o servidor os dados que sofreram alteração (marcados com o flag vermelho). Você pode fazer múltiplos updates e enviar todos para o servidor em apenas uma vez (Observe como isso foi tratado no código da classe de serviço no código fonte desse projeto).

E para deixar a vida ainda mais fácil (afinal, pra isso que usamos bibliotecas como ExtJS :D ), vamos usar o plugin RowEditor, que permite a edição dos dados de forma muito simples. Tudo o que precisa fazer para usar esse plugin é primeiro adicionar os arquivos necessários na sua página HTML (ou JSP, ou outra extensão!):

1
2 <link rel="stylesheet" type="text/css" href="/extjs-crud-grid/ext-3.1.1/examples/ux/css/rowEditorCustom.css" />
3 <link rel="stylesheet" type="text/css" href="/extjs-crud-grid/ext-3.1.1/examples/shared/examples.css" />
4 <link rel="stylesheet" type="text/css" href="/extjs-crud-grid/ext-3.1.1/examples/ux/css/RowEditor.css" />
5
6
7 <script src="/extjs-crud-grid/ext-3.1.1/examples/ux/RowEditor.js">script>

E adicionar o plugin na declaração do grid:

01var editor = new Ext.ux.grid.RowEditor({
02 saveText: 'Update'
03});
04
05// create grid
06var grid = new Ext.grid.GridPanel({
07 store: store,
08 columns: [
09 {header: "NAME",
10 width: 170,
11 sortable: true,
12 dataIndex: 'name',
13 editor: {
14 xtype: 'textfield',
15 allowBlank: false
16 }},
17 {header: "PHONE #",
18 width: 150,
19 sortable: true,
20 dataIndex: 'phone',
21 editor: {
22 xtype: 'textfield',
23 allowBlank: false
24 }},
25 {header: "EMAIL",
26 width: 150,
27 sortable: true,
28 dataIndex: 'email',
29 editor: {
30 xtype: 'textfield',
31 allowBlank: false
32 }},
33 {header: "BIRTHDAY",
34 width: 100,
35 sortable: true,
36 dataIndex: 'birthday',
37 renderer: Ext.util.Format.dateRenderer('m/d/Y'),
38 editor: new Ext.form.DateField ({
39 allowBlank: false,
40 format: 'm/d/Y',
41 maxValue: (new Date())
42 })}
43 ],
44 plugins: [editor],
45 title: 'My Contacts',
46 height: 300,
47 width:610,
48 frame:true,
49 tbar: [{
50 iconCls: 'icon-user-add',
51 text: 'Add Contact',
52 handler: function(){
53 var e = new Contact({
54 name: 'New Guy',
55 phone: '(000) 000-0000',
56 email: 'new@loianetest.com',
57 birthday: '01/01/2000'
58 });
59 editor.stopEditing();
60 store.insert(0, e);
61 grid.getView().refresh();
62 grid.getSelectionModel().selectRow(0);
63 editor.startEditing(0);
64 }
65 },{
66 iconCls: 'icon-user-delete',
67 text: 'Remove Contact',
68 handler: function(){
69 editor.stopEditing();
70 var s = grid.getSelectionModel().getSelections();
71 for(var i = 0, r; r = s[i]; i++){
72 store.remove(r);
73 }
74 }
75 },{
76 iconCls: 'icon-user-save',
77 text: 'Save All Modifications',
78 handler: function(){
79 store.save();
80 }
81 }]
82});

E Finalmente, precisamos de código no lado servidor. O Controller que implementei ficou assim:

001package com.loiane.web;
002
003import java.util.HashMap;
004import java.util.List;
005import java.util.Map;
006
007import javax.servlet.http.HttpServletRequest;
008import javax.servlet.http.HttpServletResponse;
009
010import org.springframework.web.servlet.ModelAndView;
011import org.springframework.web.servlet.mvc.multiaction.MultiActionController;
012
013import com.loiane.model.Contact;
014import com.loiane.service.ContactService;
015
016public class ContactController extends MultiActionController {
017
018 private ContactService contactService;
019
020 public ModelAndView view(HttpServletRequest request,
021 HttpServletResponse response) throws Exception {
022
023 try{
024
025 List contacts = contactService.getContactList();
026
027 return getModelMap(contacts);
028
029 } catch (Exception e) {
030
031 return getModelMapError("Error trying to retrieve contacts.");
032 }
033 }
034
035 public ModelAndView create(HttpServletRequest request,
036 HttpServletResponse response) throws Exception {
037
038 try{
039
040 Object data = request.getParameter("data");
041
042 List contacts = contactService.create(data);
043
044 return getModelMap(contacts);
045
046 } catch (Exception e) {
047
048 return getModelMapError("Error trying to create contact.");
049 }
050 }
051
052 public ModelAndView update(HttpServletRequest request,
053 HttpServletResponse response) throws Exception {
054 try{
055
056 Object data = request.getParameter("data");
057
058 List contacts = contactService.update(data);
059
060 return getModelMap(contacts);
061
062 } catch (Exception e) {
063
064 return getModelMapError("Error trying to update contact.");
065 }
066 }
067
068 public ModelAndView delete(HttpServletRequest request,
069 HttpServletResponse response) throws Exception {
070
071 try{
072
073 String data = request.getParameter("data");
074
075 contactService.delete(data);
076
077 Map modelMap = new HashMap(3);
078 modelMap.put("success", true);
079
080 return new ModelAndView("jsonView", modelMap);
081
082 } catch (Exception e) {
083
084 return getModelMapError("Error trying to delete contact.");
085 }
086 }
087
088 /**
089 * Generates modelMap to return in the modelAndView
090 * @param contacts
091 * @return
092 */
093 private ModelAndView getModelMap(List contacts){
094
095 Map modelMap = new HashMap(3);
096 modelMap.put("total", contacts.size());
097 modelMap.put("data", contacts);
098 modelMap.put("success", true);
099
100 return new ModelAndView("jsonView", modelMap);
101 }
102
103 /**
104 * Generates modelMap to return in the modelAndView in case
105 * of exception
106 * @param msg message
107 * @return
108 */
109 private ModelAndView getModelMapError(String msg){
110
111 Map modelMap = new HashMap(2);
112 modelMap.put("message", msg);
113 modelMap.put("success", false);
114
115 return new ModelAndView("jsonView",modelMap);
116 }
117
118 /**
119 * Spring use - DI
120 * @param dadoService
121 */
122 public void setContactService(ContactService contactService) {
123 this.contactService = contactService;
124 }
125
126}

Se quiser visualizar o código inteiro dessa app de exemplo (ou fazer o donwload do código completo), visite o meu repositório do GitHub: http://github.com/loiane/extjs-crud-grid

Só mais uma observação: você pode usar o dataWriter para salvar as informações que foram arrastadas para o grid com o plugin DataDrop (Lembra do plugin?). Também incluí o plugin no projeto, caso deseje testar.

Fonte: http://www.loiane.com/2010/03/extjs-e-spring-framework-exemplo-de-um-crud-grid/