[Curso de ExtJS 4] Aula 21: Data Package: Proxy Writer: CRUD Completo
Vídeo/Screencast de hoje: aula 20 do curso gratuito de Ext JS 4!
Na aula de hoje vamos aprender como usar o Ajax Proxy com um Reader. O Reader nos permite configurar a maneira que vamos ler os dados do servidor: JSON ou XML. Além disso, temos outras opções de configurações que vamos aprender na aula de hoje.
Consegui escrever o código back-end em PHP! Apesar de não saber php, com a ajuda do google consegui fazer esse exemplo. Não sei se está seguindo boas práticas do php, mas está funcionando! rs
![curso extjs4 aula21 loiane [Curso de ExtJS 4] Aula 21: Data Package: Proxy Writer: CRUD Completo](http://www.loiane.com/wp-content/uploads/2012/03/curso-extjs4-aula21-loiane.png "curso-extjs4-aula21-loiane")
Quem quiser ver todas as aulas já publicadas, é só clicar aqui.
Espero que gostem dessa aula e fico no aguardo do feedback de vocês! ![icon smile [Curso de ExtJS 4] Aula 21: Data Package: Proxy Writer: CRUD Completo](http://www.loiane.com/wp-includes/images/smilies/icon_smile.gif "[Curso de ExtJS 4] Aula 21: Data Package: Proxy Writer: CRUD Completo"){kind=icon}
Requerimentos:
- Ext JS 4 SDK
- Servidor Apache – vai nos ajudar a executar alguns exemplos mais pra frente no curso.
- Editor de Texto (qualquer um de sua preferência). No vídeo usei o Sublime Text 2 (tem pra Mac OS, Windows e Linux – a versão shareware não expira!)
- Browser (de preferência Firefox com Firebug ou Chrome).
- Php + MySQL (ou outra linguagem e banco de dados de sua preferência)
Vídeo:
Vimeo: http://vimeo.com/loiane/curso-extjs4-aula21
YouTube: http://youtu.be/3AeX6MDR5Ec
Código: https://github.com/loiane/curso-extjs4
Slides:
Até a próxima aula!
Comments (33)
Links to this Post
- Curso de ExtJS 4 - Gratuito! | Loiane Groner | 22/03/2012
Boa madrugada loiane! xD
Estao otimos os videos tudo muito bem explicado, me empouguei tanto que estava ate agora assistindo as aulas. Parabens é muito empolgante mesmo!
O video dessa aula esta como private, libera pra gente ae rs. Que logo logo estarei assistindo tbm.
liberado!:)
Uhuuuuu!!!!!!!!! Maravilha + 1 aula. Beijos Loiane!
Muito obrigado!
A aula está ótima!
Já aguardo ansioso pela próxima.
Que Deus te abençoe.
Parabéns Loiane,
Você tem uma excelente didática. Seus cursos estão me tirando da estaca “zero”…rsrs
Já me inscrevi em seu blog.
Forte abraço
Hugo
Uberlândia-MG
Muito bom Loiane, se quiser eu envio no formato do Zend.
Loiane,
eu tenho um grid q mostra alguns dados em valores,
tem como adicionar automaticamente uma linha com a soma dos valores da coluna?
No json eu trago os dados referentes a cada linha com uma consulta sql que soma os dados consultados no bd, porém eu quero somar as somas.
Exemplo: Nome — – Notas
X 1
Y 5
Z 8
TOTAL 14
obrigado
suas aulas estão ajudando muito.
Olá Lucas, o ExtJS tem algumas features para grid. Dê uma olhada em Summary e Grouping Summary para ver se alguma dessas features servem para o seu caso.
[]‘s
Parabéns pela Didática e por compartilhar conhecimento, que Deus te abençoe.
Muito obrigado por compartilhar seus conhecimentos, meus parabéns pelo curso e pela sua forma que explica tudo.
Olá Loiane, gostaria de parabenizar o seu trabalho e empenho com a carreira que você escolheu.
Gostaria de ver os exemplos em java é possível. Sei que a grande comunidade é php, mas assim como você gosto muito de java.
Olá JSilva,
Dê uma olhada no meu github, tem vários exemplos com Java lá.
Não tenho palavras para descrever o quando estou impressionado com essa vídeo-aula. Gostei muito, muito mesmo do conteúdo da mesma.
Você conseguiu em 1:40hs ilustrar o conceito geral do ExtJS o que na minha opinião, a documentação oficial não o faz.
Era esse tipo de informação que eu precisava para compreender o framework, algo que tivesse um começo, meio e fim.
Novamente, meus parabéns e muito obrigado por disponibilizar as aulas gratuitamente.
Olá Loiane,
Eu estou iniciando no Extjs 4.1, e vi um tal de Ext Direct qual a finalidade dele?
Quem mantém ele a sencha?
Ele ajuda de que forma na comunicação entre servidor e client?
Obrigado,
Cláudio.
Oi Claudio,
De modo bem artifical, o Ext direct permite que vc chame código do server no lado client, como se fosse client. Faz parte da api do ExtJS; são raras as empresas que usam essa api, por isso ela nem faz parte da grade do curso.
Eis o link com toda a descrição do ext direct: http://www.sencha.com/products/extjs/extdirect/
Só tem um detalhe: usando a api do extjs como estamos usando aqui no curso, existem brechas que permitem que você use a licença open source em vez da comercial. Usando Ext direct, não tem como correr da licença comercial!
[]‘s
Como ficaria o tratamento para quando mandamos o success false e com uma mensagem a ser apresentado para o usuário?
Grato
Oi George,
É algo do tipo:
proxy: {type: 'ajax',
reader: {..},
writer: {..},
listeners: {
exception: function(proxy, response, operation) {
Ext.MessageBox.show({
title: 'REMOTE EXCEPTION',
msg: operation.getError(),
icon: Ext.MessageBox.ERROR,
buttons: Ext.Msg.OK
});
}
}
}
Você tb pode enviar uma msg do server e pegar através do response.
Fiz algo parecido e mesmo assim não esta chamando, veja:
meu response:
message: “testing error”
msgId: null
success: false
Ext.define(“selfservice.store.Users”, {
extend: “Ext.data.Store”,
config: {
model: “selfservice.model.User”,
proxy: {
type: ‘ajax’,
url: ‘user/create.action’,
reader: {
type: ‘json’,
totalProperty: ‘total’,
successProperty: ‘success’,
idProperty: ‘id’,
root: ‘data’,
messageProperty: ‘message’ // <– New "messageProperty" meta-data
},
writer: {
type: 'json',
root: 'data',
encode: true,
writeAllFields: true,
allowSingle: true
},
listeners: {
exception: function (list, index, item, record) {
console.log("exception : ");
/*
var dados = Ext.decode(response.responseText);
var msg = res.message;
if (res.msgId != null) {
msg = Ext.i18n.Bundle.message(res.msgId);
}
Ext.Msg.show({
title: 'ERROR',
msg: msg,
icon: Ext.MessageBox.ERROR,
buttons: Ext.Msg.OK
});
*/
};
}
}
});
Tem que lançar a exceção na lado server e no retorno colocar isso. Apenas fazer o retorno não vai!
o q vc diz q mesmo eu colocando o erro no json ainda tenho q lançar uma exception? q estranho hahaha
vou tentar
Loiane, fiz um teste aqui, mais veja, se lanço uma exception o Extjs dá problema, não pega no listener:
500 (Internal Server Error)
dá isso e quebra o sistema, teria outra idéia? preciso resolver isso, estou sem saber o que fazer…
achei que só em retornar success false, ele já tentaria entender o que aconteceu…
o que puder me ajudar novamente…
tks
George
George,
Olhe esse exemplo, foi feito em Java, mas é só aplicar a mesma idéia para a linguagem que vc está usando:
https://github.com/loiane/ext4-crud-mvc
Loiane, muito obrigado por enviar o ext-crud… realmente esta funcionando como falou, acho que eu que não passei uma informação crucial, estou fazendo com sencha touch 2… estou tentando portar o que vc enviou para ver se é algo com ele, pois o meu esta igual…
Grato
George
Consegui resolver… desculpe tanto abuso… a forma de declarar meu proxy no store estava errado hehhehe
Tks a lot
George
Uma pergunta sobre o exemplo de crud que me envias-tes… Como vc fez para que seu método java recebe um wrapper de um java bean? eu tentei aqui e daí o request do sencha passa a não encontrar o método, tive que deixar recebendo um Object.
tks
George
Isso é padrão da versão do Spring que estou usando – versão 3, então é automático.
Então, montei meu projeto com base no seu, mesmos jars, configuração e tudo, e mesmo assim não foi :/ estou tendo q passar um Object como parametro :s
Que estranho! os atributos que vc está mandando está igualzinho ao do wrapper? Tenta rodar esse projeto que te enviei.
Sim, fiz um igual a wrapper contendo uma instancia do meu model… rs… se depois tiver um tempo, tenho o projeto no git…
Suas vídeos aulas estão ótimas, só uma observação em 31:01, naquele caso, a função dentro do on('load') consegue acessar a variável "store", pois está no mesmo escopo de "var store" (é ai que entra a regra de fechamento do JavaScript, acabei de pesquisar o nome correto para isso, que é "Closures"), mas o Ext passa a referência do objeto pois nem sempre você chama o on('load') no mesmo escopo… isso é uma coisa que eu acho muito the hora em JavaScript, é assim que são criados variáveis "privadas" por exemplo… Que Deus abençoes e poste logo as outras aulas, rssss…
Suas vídeos aulas estão ótimas, só uma observação em 31:01, naquele caso, a função dentro do on('load') consegue acessar a variável "store", pois está no mesmo escopo de "var store" (é ai que entra a regra de fechamento do JavaScript, acabei de pesquisar o nome correto para isso, que é "Closures"), mas o Ext passa a referência do objeto pois nem sempre você chama o on('load') no mesmo escopo… isso é uma coisa que eu acho muito the hora em JavaScript, é assim que são criados variáveis "privadas" por exemplo… Que Deus abençoes e poste logo as outras aulas, rssss…
kkkkk… o face está trocando o " D a H o r a" por "T h e H o r a"… kkkk…