ExtJS + VRaptor

@Post
	public void update(Contato data){
		this.daoGenerico.update(data);
		result.use(ExtJSJson.class).from(data).success(true).serialize();
	}

Ext.define('ExtMVC.controller.Contatos', {
    extend: 'Ext.app.Controller',
 
    stores: ['Contatos'],
 
    models: ['Contato'],
 
    views: ['contato.Formulario', 'contato.Grid'],
 
    refs: [{
            ref: 'contatoPanel',
            selector: 'panel'
        },{
            ref: 'contatoGrid',
            selector: 'grid'
        }
    ],
 
    init: function() {
        this.control({
            'contatogrid dataview': {
                itemdblclick: this.editarContato
            },
            'contatogrid button[action=add]': {
                click: this.editarContato
            },
            'contatogrid button[action=delete]': {
                click: this.deleteContato
            },
            'contatoform button[action=save]': {
                click: this.updateContato
            }
        });
    },
 
    editarContato: function(grid, record) {
        var edit = Ext.create('ExtMVC.view.contato.Formulario').show();
 
        if(record){
            edit.down('form').loadRecord(record);
        }
    },
 
    updateContato: function(button) {
    	var win    = button.up('window'),
            form   = win.down('form'),
            record = form.getRecord(),
            values = form.getValues();    	    
   	
    	var novo = false;
        
        if (values.id > 0){
        	record.set(values);
        } else{        	
        	record = Ext.create('ExtMVC.model.Contato');
            record.set(values);
            this.getContatosStore().add(record);
            novo = true;
        }
       
        win.close();
        
        var teste = this.getContatosStore(); 
        alert( teste );
        
        this.getContatosStore().sync();
 
        if (novo){ //faz reload para atualziar
            this.getContatosStore().load();
        }
    },
 
    deleteContato: function(button) {
 
        var grid = this.getContatoGrid(),
        record = grid.getSelectionModel().getSelection(),
        store = this.getContatosStore();
 
        store.remove(record);
        this.getContatosStore().sync();
 
        //faz reload para atualziar
        this.getContatosStore().load();
    }
});

Ext.define('ExtMVC.model.Contato', {
    extend: 'Ext.data.Model',
    fields: ['id', 'name', 'phone', 'email']
});

Ext.define('ExtMVC.store.Contatos', {
    extend: 'Ext.data.Store',
    model: 'ExtMVC.model.Contato',
    autoLoad: true,
    pageSize: 35,
    autoLoad: {start: 0, limit: 35},
 
    proxy: {
    	simpleSortMode: true,  
    	type: 'ajax',
        api: {
        	read: 'contatos/list',
        	create: 'contatos/create',
        	update: 'contatos/update.json',
        	destroy: 'contatos/delete'
        },          
        reader: {
            type: 'json',
            root: 'data'
        },
        writer: {
            type: 'json',
            writeAllFields: true,
            encode: false,
            root: 'data'
        }       
    }    
});

Ext.define('ExtMVC.view.contato.Formulario', {
    extend: 'Ext.window.Window',
    alias : 'widget.contatoform',
 
    requires: ['Ext.form.Panel','Ext.form.field.Text'],
 
    title : 'Editar/Criar Contato',
    layout: 'fit',
    autoShow: true,
    width: 280,
     
    iconCls: 'icon-user',
 
    initComponent: function() {
        this.items = [
            {
                xtype: 'form',
                padding: '5 5 0 5',
                border: false,
                style: 'background-color: #fff;',
                 
                fieldDefaults: {
                    anchor: '100%',
                    labelAlign: 'left',
                    allowBlank: false,
                    combineErrors: true,
                    msgTarget: 'side'
                },
 
                items: [
                    {
                        xtype: 'textfield',
                        name : 'id',
                        fieldLabel: 'id',
                        hidden:true
                    },    
                    {
                        xtype: 'textfield',
                        name : 'name',
                        fieldLabel: 'Nome'
                    },
                    {
                        xtype: 'textfield',
                        name : 'phone',
                        fieldLabel: 'Telefone'
                    },
                    {
                        xtype: 'textfield',
                        name : 'email',
                        fieldLabel: 'Email'
                    }
                ]
            }
        ];
         
        this.dockedItems = [{
            xtype: 'toolbar',
            dock: 'bottom',
            id:'buttons',
            ui: 'footer',
            items: ['->', {
                iconCls: 'icon-save',
                text: 'Salvar',
                action: 'save'
            },{
                iconCls: 'icon-reset',
                text: 'Cancelar',
                scope: this,
                handler: this.close
            }]
        }];
 
        this.callParent(arguments);
    }
});

<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<html>
	<head>
		<title>TESTE</title>
    	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    	
		<link rel="stylesheet" href="extjs/resources/css/ext-all.css">
		<script type="text/javascript" src="<c:url value="/extjs/ext-all-dev.js"/>"></script>
		<script type="text/javascript" src="app.js"></script>
			
	</head>
<body> 

</body>

<script type="text/javascript">

</script>			
</html>

// Carregamento dinâmico
Ext.Loader.setConfig({enabled: true});
 
Ext.application({
    // Nome da aplicação
	name: 'ExtMVC',
 
    
	// Controllers da Aplicação
	controllers: [
        'Contatos'
    ],
 
    // Se verdadeiro, a aplicação vai instanciar a classe Viewport automaticamente. Para isso, temos que ter um arquivo chamado Viewport.js dentro da pasta app/view. 
    autoCreateViewport: true
});