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

Informática -> JSON -> JSON Tag Library - Examples

JSON Tag Library - Examples

This section shows some code examples of how the json-taglib could be used in real world situations.

Shopping Cart

You need to add AJAX functionality to an e-commerce application. Whenever the user adds an item to their cart, you want to render the new contents of the cart as JSON, so the browser can update the cart display dynamically.

Assume you have a cart object that contains, amongst other things, a collection of lineItems.

Shopping Cart

You need to add AJAX functionality to an e-commerce application. Whenever the user adds an item to their cart, you want to render the new contents of the cart as JSON, so the browser can update the cart display dynamically.

Assume you have a cart object that contains, amongst other things, a collection of lineItems.

<%@ taglib prefix="json" uri="http://www.atg.com/taglibs/json" %>

<json:object>
<json:property name="itemCount" value="${cart.itemCount}"/>
<json:property name="subtotal" value="${cart.subtotal}"/>

<json:array name="items" var="item" items="${cart.lineItems}">
<json:object>
<json:property name="title" value="${item.title}"/>

<json:property name="description" value="${item.description}"/>
<json:property name="imageUrl" value="${item.imageUrl"/>
<json:property name="price" value="${item.price}"/>

<json:property name="qty" value="${item.qty}"/>
</json:object>
</json:array>
</json:object>

...produces this JSON...

{
itemCount: 2,
subtotal: "$15.50",
items:[
{
title: "The Big Book of Foo",
description: "Bestselling book of Foo by A.N. Other",
imageUrl: "/images/books/12345.gif",
price: "$10.00",
qty: 1
},
{
title: "Javascript Pocket Reference",
description: "Handy pocket-sized reference for the Javascript language",
imageUrl: "/images/books/56789.gif",
price: "$5.50",
qty: 1
}
]
}

Shopping Cart (part 2)

The above example was quite simplistic. If your e-commerce store supported multiple languages and currencies, then it is likely that you would want to show your pricing data using the correct format for that locale.

Here we'll add the JSTL Format tag to render the prices using the appropriate currency formatting.

Shopping Cart (part 2)

The above example was quite simplistic. If your e-commerce store supported multiple languages and currencies, then it is likely that you would want to show your pricing data using the correct format for that locale.

Here we'll add the JSTL Format tag to render the prices using the appropriate currency formatting.

<%@ taglib prefix="json" uri="http://www.atg.com/taglibs/json" %>

<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>

<json:object>
<json:property name="itemCount" value="${cart.itemCount}"/>

<json:property name="subtotal">
<fmt:formatNumber value="${cart.subtotal}" type="currency" currencyCode="${cart.currency}"/>
</json:property>

<json:array name="items" var="item" items="${cart.lineItems}">
<json:object>
<json:property name="title" value="${item.title}"/>

<json:property name="description" value="${item.description}"/>
<json:property name="imageUrl" value="${item.imageUrl"/>
<json:property name="price">

<fmt:formatNumber value="${item.price}" type="currency" currencyCode="${cart.currency}"/>
</json:property>
<json:property name="qty" value="${item.qty}"/>

</json:object>
</json:array>
</json:object>
Fonte:

Informática -> JSON -> JSON Tag Library

JSON Tag Library

JSON-taglib is a JSP 2.0 tag library used to render JSON (JavaScript Object Notation) data from within JSP code. It can be used as part of the server-side of an AJAX application, allowing you to use the full power of JSP to format your JSON data.

The tag library is built on the Java JSON library written by Douglas Crockford.

What is JSON?

JSON is a lightweight data interchange format. It is a text-based, human-readable format for representing data structures. JSON is a subset of the object literal notation of JavaScript and is used extensively in AJAX web applications. For more information about JSON, check out JSON.org

Quick-Start

Just drop the json-taglib.jar file into the WEB-INF/lib directory of your web-application.

Here's a quick example of how the taglib could be used with an AJAX e-commerce shopping cart. Check out the examples or the tutorial for full details of how to use the taglib.

The following JSP...

<json:object>
<json:property name="itemCount" value="${cart.itemCount}"/>
<json:property name="subtotal" value="${cart.subtotal}"/>

<json:array name="items" var="item" items="${cart.lineItems}">
<json:object>
<json:property name="title" value="${item.title}"/>

<json:property name="description" value="${item.description}"/>
<json:property name="imageUrl" value="${item.imageUrl"/>
<json:property name="price" value="${item.price}"/>

<json:property name="qty" value="${item.qty}"/>
</json:object>
</json:array>
</json:object>

...produces this JSON...

{
itemCount: 2,
subtotal: "$15.50",
items:[
{
title: "The Big Book of Foo",
description: "Bestselling book of Foo by A.N. Other",
imageUrl: "/images/books/12345.gif",
price: "$10.00",
qty: 1
},
{
title: "Javascript Pocket Reference",
description: "Handy pocket-sized reference for the Javascript language",
imageUrl: "/images/books/56789.gif",
price: "$5.50",
qty: 1
}

Be sure to check out the examples or the tutorial for more information about how to use the taglib.

Fonte:


Informática -> JSON -> JSP and AJAX Examples

JSPAndAJAXExamples

Examples of JSP and AJAX
        • Example 1 - Server side JSP encoding
        • Example 2 - Client side XMLHttpRequest

Example 1 - Server side JSP encoding

service.jsp:

  <%@page contentType="text/html; charset=UTF-8"%>
<%@page import="org.json.simple.JSONObject"%>
<%
JSONObject obj=new JSONObject();
obj
.put("name","foo");
obj
.put("num",new Integer(100));
obj
.put("balance",new Double(1000.21));
obj
.put("is_vip",new Boolean(true));
obj
.put("nickname",null);
out.print(obj);
out.flush();
%>

Please note that you need to place json_simple-1.1.jar in WEB-INF/lib before running the JSP. Then the client side will get the resulting JSON text.

Example 2 - Client side XMLHttpRequest

client.html:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>

<script type="text/javascript">
function createXMLHttpRequest(){
// See http://en.wikipedia.org/wiki/XMLHttpRequest
// Provide the XMLHttpRequest class for IE 5.x-6.x:
if( typeof XMLHttpRequest == "undefined" ) XMLHttpRequest = function() {
try { return new ActiveXObject("Msxml2.XMLHTTP.6.0") } catch(e) {}
try { return new ActiveXObject("Msxml2.XMLHTTP.3.0") } catch(e) {}
try { return new ActiveXObject("Msxml2.XMLHTTP") } catch(e) {}
try { return new ActiveXObject("Microsoft.XMLHTTP") } catch(e) {}
throw new Error( "This browser does not support XMLHttpRequest." )
};
return new XMLHttpRequest();
}

var AJAX = createXMLHttpRequest();

function handler() {
if(AJAX.readyState == 4 && AJAX.status == 200) {
var json = eval('(' + AJAX.responseText +')');
alert
('Success. Result: name => ' + json.name + ',' + 'balance => ' + json.balance);
}else if (AJAX.readyState == 4 && AJAX.status != 200) {
alert
('Something went wrong...');
}
}

function show(){
AJAX
.onreadystatechange = handler;
AJAX
.open("GET", "service.jsp");
AJAX
.send("");
};
</script>

<body>
<a href="#" onclick="javascript:show();"> Click here to get JSON data from the server side</a>
</html>

Please place client.html and service.jsp (see Example 1) in the same directory and then open client.html in IE or Firefox, click the link and you'll get result.


Informática -> JSON - JAVA

JSON e Java


scrnshot-json

Como dito aqui, JSON é uma opção para transitar dados entre o browser e o servidor.

Como desenvolvedora Java, tenho que saber como integrar JSON com a minha linguagem predileta. Então vamos lá:

Como Json pode ser útil para os desenvolvedores java?

  • Aplicações com Ajax (muito mais fácil e simples trabalhar com objetos javascript)
  • RESTful web services (Google AJAX Search API – usado em ambientes que não sejam javascript – retorna em formato JSON)

Algumas bibliotecas JSON para o Java

Além de poder trabalhar com JSON com alguns frameworks como Struts e Spring.

Atualmente estou trabalhando com Json-lib.

Escolha a sua lib e seja feliz! :)

Até a próxima

Referência: http://www.json.org/

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/