Chamar metodo post e atualizar datatable

[Marcos Filho]

indo direto ao ponto pessoal, preciso que ao clicar em um botão, ele
chame um metodo passando um codigo como parametro, recupere o objeto
no metodo, adicione o objeto em uma lista e atualize o datatable.

o que eu fiz até agora foi o seguinte:

metodo que chamo:

@Post
@Path("/usuario/addEmpresa/{codigoExterno}")
public void addEmpresa(int codigoExterno) {
if(codigoExterno != 0 ) {
Empresa emp = this.empresaRep.findEmpresaById(codigoExterno);
this.empresas.add(emp);
}
}

e na pagina estou fazendo o seguinte:

$(document).ready(function(){
$('#addEmpresa').on('click', function(){
oTable = $('#empresaList').dataTable();
var self = $('#codigoDaEmpresa');
var selecionado = self.val(); // pega o codigo digitado no input
$.ajax({
url:'<c:url value="/usuario/addEmpresa/" />'+selecionado,
type: 'POST',
success:function(){
oTable.fnReloadAjax();
},
error:function(){
alert('Erro');
}
});
});
});

porem ele só me retona a mensagem de erro, estou debugando e no metodo
está recuperando e inserindo o objeto corretamente.

[Chico Sokol]

O erro pode estar acontecendo em algum interceptor depois do controller. Manda a stacktrace pra gente ver.

--
Chico Sokol

--
You received this message because you are subscribed to the Google Groups "caelum-vraptor" group.
To unsubscribe from this group and stop receiving emails from it, send an email to caelum-vrapto...@googlegroups.com.
To post to this group, send email to caelum-...@googlegroups.com.
Visit this group at http://groups.google.com/group/caelum-vraptor?hl=en.
For more options, visit https://groups.google.com/groups/opt_out.

[Rodrigo Turini]

Oi Marcos! Parece que faltou um result.nothing() no seu controller. 

De uma olhada em http://vraptor.caelum.com.br/pt/docs/view-e-ajax/

Ficaria algo como:

    @Post
    @Path("/usuario/addEmpresa/{codigoExterno}")
    public void addEmpresa(int codigoExterno) {
        if(codigoExterno != 0 ) {
            Empresa emp = this.empresaRep.findEmpresaById(codigoExterno);
            this.empresas.add(emp);
        }

        result.nothing();
    }

Esse result você recebe por DI no seu controller. Algo como o exemplo:

@Resource

public class ClientsController {

    private final Result result;

    public ClientsController(Result result) {

        this.result = result;

    }

2013/5/20 Marcos Filho <mar...@ffm.com.br>

[Marcos Filho]

não possui. o erro que estou falando é que ele cai no metodo
error:function e imprime a msg de error.

[Marcos Filho]

Então rodrigo, seguinte, adicionei o result.nothing, nao está mais
gerando a msg de erro mais tambem nao está aparecendo os objetos na
lista, veja se fiz corretamente:

MeuController...

//lista temporaria
private List<Empresa> empresas = new ArrayList<Empresa>();


//pagina formulario onde estou chamando o metodo addEmpresa
public void formulario() {
this.result.include("empresaList", this.empresas);

}

@Post
@Path("/usuario/addEmpresa/{codigoExterno}")
public void addEmpresa(int codigoExterno) {
if(codigoExterno != 0 ) {
Empresa emp = this.empresaRep.findEmpresaById(codigoExterno);

this.empresas.add(emp);//Inserindo objeto na lista temporaria
}
this.result.nothing();
}

está correto dessa forma?

[Chico Sokol]

Deve ser isso mesmo que o Rodrigo falou, deve estar dando 404 no ajax.

Quando você precisar debugar ajax no chrome, você pode abrir a aba de network das dev tools do chrome e ver os requests na aba network (f12 > network).

--
Chico Sokol

[Marcos Filho]

Não está mais caindo no Error function, porem acho que eu nao estou
atualizando a lista de objetos corretamente. ;/

[Marcos Filho]

Estou recebendo o result no construtor corretamente, mais axo que como
falei um pouco mais acima como estou demonstrando minha lista, axo que
posso estar fazendo errado. dá uma olhada, está 3 post's acima

[Chico Sokol]

Você queria que a lista de empresas ficasse com as empresas enquanto o sujeito preenche o form? Se for isso, você vai precisar criar uma classe pra guardar as empresas e anotar com SessionScoped. 

Tipo assim:

@Component

@SessionScoped

public class DadosDoMeuForm {

   private listaDeEmpresas = ....

   public adicionaNaLista(Empresa e) { ... }

}

Aí você recebe esse cara injetado no seu controller.

--
Chico Sokol

On Mon, May 20, 2013 at 10:28 AM, Marcos Filho <mar...@ffm.com.br> wrote:

Não está mais caindo no Error function, porem acho que eu nao estou
atualizando a lista de objetos corretamente. ;/

[Rodrigo Turini]

Nesse caso, você insere o objeto na lista temporaria, mas qual 

javascript que atualiza o conteudo dessa lista depois do seu ajax?

Confere também se no seu console não aparece nenhum erro de

javascript (apertando F12 no chrome ou firefox), olha a aba console.

2013/5/20 Marcos Filho <mar...@ffm.com.br>

[Marcos Filho]

@CHico:

não na verdade é um campo onde ele vai digitar o codigo da empresa, e
clicar em adicionar, e em baixo tem um datatable onde tem um
empresaList, ai ele chama o metodo no servidor passando o codigo da
empresa, recupera o objeto lá, insere na empresas.add o objeto e só,
ai na sucess estou fazendo o reload do datatable para atualizar a
lista, digamos assim.

@rodrigo

então rodrigo estou supondo que esse oTable.fnReloadAjax(); está
efetuando o update do datatable, e como o datatable possui a lista,
ele iria atualizar, mais debugando aqui ele nao está entrando dentro
do success onde se encontra o otable.fn... porem nao envia mensagem de
error, axo que esse (result) possa estar errado.

2013/5/20 Rodrigo Turini <rdrg....@gmail.com>:

[Marcos Filho]

acabei de criar um alert no

success:function(result){
alert('teste');

oTable.fnReloadAjax();
},
error:function(){
alert('Erro');

e ele está imprimindo o 'teste' porem axo que ele nao atualiza a lista
somente efetuando esse fnReload, preciso criar um outro javascript
para atualizar essa lista?

[Chico Sokol]

O que é esse fnReloadAjax, Marcos? É de algum plugin do jquery?

De qualquer forma, você precisa devolver os dados da empresa para o navegador. Dá uma lida no link que o Rodrigo passou: http://vraptor.caelum.com.br/pt/docs/view-e-ajax/

O javascript não tem como carregar a lista de empresa que estava no controller se você não enviar os dados na resposta do request. 

--
Chico Sokol

[Marcos Filho]

Chico, axo que explicando essa parte do codigo fica melhor

para facilitar, digamos assim: na minha pagina minha table está da
seguinte forma:

<table id="empresaList" class="table table-bordered table-striped table-hover">
<thead>
<tr>
<th>#</th>
<th>Descricao</th>
<th>Cnpj</th>
</tr>
</thead>

<tbody>
<c:forEach items="${empresaList}" var="empresa">
<tr>
<td>${empresa.codigo}</td>
<td>${empresa.descricao}</td>
<td>${empresa.cnpj}</td>
</tr>
</c:forEach>
</tbody>
</table>

eu quero atualizar esse ${empresaList}

[Rodrigo Turini]

Oi Marcos, quando você usa o ajax, você precisa atualizar os 

dados no callback de success dele, então uma das formas seria

retornar o objeto como json (como no link http://vraptor.caelum.

com.br/pt/docs/view-e-ajax/) e preencher a tabela com esses dados,

ou então você pode abrir mão do ajax e fazer um result.forward pro

seu formulario, ficaria bem mais simples, algo como:

@Post("/usuario/addEmpresa/{codigoExterno}")

public void addEmpresa(int codigoExterno) {
if(codigoExterno != 0 ) {
Empresa emp = this.empresaRep.findEmpresaById(codigoExterno);
this.empresas.add(emp); //Inserindo objeto na lista temporaria
}

this.result.forward(this).formulario();
}

2013/5/20 Marcos Filho <mar...@ffm.com.br>

[Chico Sokol]

Entendi. Então Marcos, esse código da jsp não vai ser executado no request ajax. Só vai executar  no primeiro request pra mostrar o form, entendeu? 

Depois de mostrar o form pro seu usuário você só tem html e javascript daí pra frente, sacou? Então, se você não quer ficar sempre recarregando todo o form, você tem que fazer o request ajax, devolver os dados que quer mostrar, e colocar no html.

--
Chico Sokol

2013/5/20 Marcos Filho <mar...@ffm.com.br>

[Chico Sokol]

Dá uma olhada nesse capítulo da apostila do fj-21 da caelum também pra te dar uma esclarecida no que está acontecendo: http://www.caelum.com.br/apostila-java-web/apendice-vraptor3-e-produtividade-na-web/#17-19-para-saber-mais-ajax

--
Chico Sokol

2013/5/20 Chico Sokol <chico...@gmail.com>

[Marcos Filho]

ok, vou tentar retornar um json e montar na tela o datatable.

[Marcos Filho]

Bem, estou conseguindo agora povoar meu datatable, mais agora me
surgiu um outro imprevisto, estou adicionando os objetos corretamente,
ja esta mostrando tudo direitim, porem está efetuando sempre uma nova
lista. Por exemplo, quando adiciono um objeto novo ele em vez de
mostrar a lista com 2 objetos mostra só com um, estou suspeitando que
por minha lista está private List<Empresa> empresas = new
ArrayList<Empresa>(); ele toda vez que efetua o request ele cria uma
nova lista e adiciona o objeto, de forma que sempre vai me retornar um
por motivo do controller ser request scope (eu axo), tem como
contornar isso sem trabalhar com o controller do tipo Session?

[Chico Sokol]

Você sempre adiciona as empresas de um em um não é? Então você pode só devolver os dados de uma empresa a cada request e não uma lista. Aí você apenas adiciona os dados dessa empresa no ajax ao invés de reconstruir toda a tabela sempre.

--
Chico Sokol

2013/5/20 Marcos Filho <mar...@ffm.com.br>

Bem, estou conseguindo agora povoar meu datatable, mais agora me

[Marcos Filho]

o problema é que dessa forma sempre minha lista vai ter o ultimo
objeto na tabela, quando eu for salvar e no metodo eu efetuar o
objeto.setLista ele em vez de setar todos os objetos que eu havia
inserido, ele só vai inserir o ultimo, pois só possui um a cada
request.

[Chico Sokol]

Marcos, acho que eu não estou entendendo exatamente o que você quer fazer.

A sua página é um formulário? De alguma entidade que possui uma lista de empresas, é isso? Você precisa carregar as empresas conforme o usuário insere os ids? O que você precisa fazer com as empresas que você busca no banco?

[Rodrigo Turini]

Marcos, só pra ficar mais claro, no seu controller quando você faz:

Empresa emp = this.empresaRep.findEmpresaById(codigoExterno);
this.empresas.add(emp); //

Inserindo objeto na lista temporaria

Significa que você tem um repositorio com todas as possiveis empresas,

e que o usuario só pode adicionar uma dessas empresas em sua tabela,

certo? Você não vai querer manter essas informações de alguma forma?

(salvar no banco de dados, etc) ou vai ficar só em memoria mesmo?

De toda forma, a ideia é: no seu ajax quando der o success já inserir uma

linha na tabela com os dados que você devolver no result, algo como:

@Post("/usuario/addEmpresa/{codigoExterno}")

public void addEmpresa(int codigoExterno) {
if(codigoExterno != 0 ) {
Empresa emp = this.empresaRep.findEmpresaById(codigoExterno);
}

result.use(json()).from(emp).serialize();
}

e no seu ajax, lá dentro do success algo como: 

success:function(result){
    var obj = jQuery.parseJSON(result);
     // js pra ir na tabela e adicionar uma linha com obj.nome, obj.codigo
     // e por ai vai. Fez sentido? O js de adicionar a linha na tabela você
    // consegue consultar na apostila aberta do FJ-21... ou na api do jquery
},

Essa é uma das varias formas que dá pra fazer, o intuito é funcionar e daí

você pode ir melhorando e evoluindo seu código. 

[Marcos Filho]

opa rodrigo, é dessa forma que está funcionando, o problema é o
seguinte, essas empresas vou adicionar no Usuario.SetEmpresas(uma
lista), só que ainda nao existe um usuario criado, na tela de criar o
usuario tbm é onde preciso já inserir as empresas, e quando eu chamar
o metodo salvar ele vai fazer aldo do tipo.

Usuario.setEmpresas(this.empresas);
salvarusuario...

só que se eu fizer isso esses this.empresas setará somente o ultimo,
pois ele está salvando somente 1, quanto a povoar a lista e mostrar na
tabela ja estou conseguindo fazer isso sim atraves do json o problema
é que em vez dessa lista possuir 2, 3 , 4 ou quantas empresas eu
quiser adicionar, sempre esta ficando somente a ultima empresa que eu
estou efetuando o .add, e quando eu chamar o metodo salvar em vez de
ter as 5 ou N empresas que eu adicionei, só terá a ultima que foi a
que eu adicionei por ultimo.

meu codigo atualmente está da seguinte forma:

@Resource
public class UsuarioController {

private final UsuarioRepositorio userRep;
private final Result result;
private final EmpresaRepositorio empresaRep;
private final List<Empresa> empresas = new ArrayList<Empresa>();
public UsuarioController(UsuarioRepositorio rep, Result result,
EmpresaRepositorio empresaRep) {
this.userRep = rep;
this.result = result;
this.empresaRep = empresaRep;

}
public void formulario() {
this.result.include("empresaList", this.empresas);
}

//outros metodos

public void salvar(Usuario usuario) {
Integer codigo = usuario.getCodigo();
if(codigo == null || codigo == 0) {
//usuario.setEmpresas(this.empresas); //aqui que estou setando as
empresas no usuario
usuario.getPermissao().add("ROLE_USUARIO");
usuario.setAtivo(true);
this.userRep.save(usuario);
} else {
this.userRep.update(usuario);
}
result.redirectTo(this).listar();
}


@Post
@Path("/usuario/addEmpresa/{codigoExterno}")

public void addEmpresa(int codigoExterno) {
if(codigoExterno != 0 ) {
Empresa emp = this.empresaRep.findEmpresaById(codigoExterno);

this.empresas.add(emp);
}
result.use(Results.json()).withoutRoot().from(empresas).serialize();
}
}

na minha pagina:

$(document).ready(function(){
$('#addEmpresa').on('click', function(){

var self = $('#codigoDaEmpresa');
var selecionado = self.val(); // pega o codigo digitado no input
$.ajax({
url:'<c:url value="/usuario/addEmpresa/" />'+selecionado,
type: 'POST',

dataType:'json',
success:function(data){
var options = [];
for (var i = 0; i < data.length; i++) {
options.push('<td>'+data[i].codigo+'</td>');
}

// Agora estou juntando os options dentro do componente
$('#povoarEmpresa').html(options.join());

},
error:function(){
alert('Erro');
}

});
});
});

[Rodrigo Turini]

Quando você faz $('#povoarEmpresa').html(options.join()); você está substituindo 

o html do elemento com id povoarEmpresa pelo que você recebeu no result, mas

na verdade você quer incrementar ele, fazer um append ou algo do tipo.

[Marcos Filho]

acho que você ainda nao está entendendo, até ae tudo bem, o problema é
que minha no controllador estara sempre com 1 elemento na lista, mesmo
que eu coloque append, ok ele vai "mostrar" todos, mais quando salvar,
salvará somente o ultimo, pq é o ultimo que está na lista.

[Marcos Filho]

eu venho do jsf e lá eu resolveria isso utilizando ViewScope, mais no
vraptor nao possui isso, e se eu utilizar SessionScope se eu for criar
um novo usuario e ao tentar povoar uma nova lista ele vai mostrar as
mesmas empresas que povoei para um usuario anterior pq estará com a
lista na sessao.

[Chico Sokol]

Marcos, como está o método que salva o usuário no controller?

--
Chico Sokol

2013/5/20 Marcos Filho <mar...@ffm.com.br>

eu venho do jsf e lá eu resolveria isso utilizando ViewScope, mais no

[Rodrigo Turini]

Marcos, o problema é que o controller do VRaptor é requestScoped, 

então a cada request sua ele cria uma lista de empresas nova, e não 

mantem os dados da request anterior. Você precisa guardar essas

empresas em outro lugar, nem que seja em uma classe SessionScoped 

igual o Chico te explicou no inicio dessa thread. Fez sentido?

Em 20 de maio de 2013 13:26, Marcos Filho <mar...@ffm.com.br> escreveu:

[Rodrigo Turini]

É que fora do jsf a integração com a view não é tão magica :) você 

precisa guardar esses caras em algum lugar (que não seja no controller

que tem escopo de request) e dar include nessa lista que guardou.

[Marcos Filho]

Mais é exatamente isso que estou querendo fazer, mais com o vraptor
nao tenho como guardar essa lista em outro canto sem que seja session
digamos assim.

@Chico, o metodo salvar está 3 ou 4 post acima possui todo o meu controller.

@Rodrigo é acho que terei que ver uma forma de trabalhar com session
scope mesmo, nao consigo ver outra solução, o problema é que nessas
situaçoes o framework me limita muito quando eu preciso de algo
temporario mas que nao precise que seu tempo de vida seja durante uma
session, um @viewscope ae salvaria vidas, mas, temos que trabalhar da
forma que podemos, vou procurar uma solução utilizando session somente
para essa lista

[Chico Sokol]

Você precisa mesmo manter o estado no servidor das empresas que estão no form do cara? Porque, pelo que eu entendi um usuário tem uma lista de empresas, certo? Então você pode simplesmente receber a lista de empresas (ou ids) no controller, tipo assim:

public void salva(Usuario u, List<Empresa> empresas) {

   u.setEmpresas(buscaEmpresasNoBanco(empresas))

   salvaUsuario(u)

}

Aí você usa ajax só pra facilitar a preencher o form no navegador.

--
Chico Sokol

2013/5/20 Marcos Filho <mar...@ffm.com.br>

Mais é exatamente isso que estou querendo fazer, mais com o vraptor

[Marcos Filho]

chico e na visão, como eu poderia setar por exemplo
empresa[1].codigo
empresa[1].descricao
empresa[2].codigo
empresa[2].descricao
...

e passar para esse List<Empresa> empresas

public void salva(Usuario u, List<Empresa> empresas) {
u.setEmpresas(buscaEmpresasNoBanco(empresas))
salvaUsuario(u)
}

é possivel eu povoar a lista completa na visão e de uma vez só setar
todos as empresas nessa lista de uma só vez sem ter que efetuar uma
nova requisiçao?

[Chico Sokol]

É isso mesmo, Marcos.

Não entendi sua dúvida exatamente. Se os seus usuários sabem o código das empresas, seria só eles irem escreverem os códigos no form e blz.

[Marcos Filho]

a ideia é que eles insiram o codigo no form e mandar buscar e vai
mostrar em baixo dessa opḉao buscar os seguintes campos:

codigo
descricao
cnpj

se for exatamente essa empresa que ele quer, vai ter um botao logo
abaixo, Adicionar, e ele vai adicionar essas empresas em uma lista
para que possa associar ao usuario que tambem está sendo criado nesse
mesmo form.

minha duvida é como eu poveria DIRETAMENTE na visão, preencher essa
lista e mandar para o metodo via parametro? eu sei que o usuario vai
via name=usuario.nome e como seria os varios objetos dessa lista?

[Chico Sokol]

Para a lista, você pode fazer assim:

<input type="text" name="empresas[].codigo" />

<input type="text" name="empresas[].codigo" />

<input type="text" name="empresas[].codigo" />

<input type="text" name="empresas[].codigo" />

...

E aí no método controller você recebe uma List<Empresa>, você precisa criar o setter pro código.

--
Chico Sokol

2013/5/20 Marcos Filho <mar...@ffm.com.br>

a ideia é que eles insiram o codigo no form e mandar buscar e vai

[Marcos Filho]

é pq a ideia principal é que quando eu clicasse no botao adicionar ele
iria setar no
empresas[1].codigo
empresas[1].descricao...

teria como fazer isso com javascript? por exemplo ao clicar no
adicionar ele vai setar em um parametro do tipo
empresas[i].codigo e empresas[i].descricao efetuando um Add nesse
array e quando chamar o metodo ele ir como parametro?

[Chico Sokol]

Você pode criar o <input> com javascript mesmo, acho que dá pra fazer assim:

$("form").append("<input ... value=o_que_vier_do_ajax />")

Deve ter jeitos mais bonitos de fazer, mas é uma solução.

--
Chico Sokol

[Marcos Filho]

estou pensando em algo do tipo mesmo, só que dessa forma ele vai setar
na visao um campo input, a ideia é que nao mostrasse nenhum campo a
mais, e sim que fique "escondido" mais que esteja no name.

ah, outra coisa, como é lista tem que estar no name ou value do input?

[Chico Sokol]

Você pode colocar um input type=hidden

$(bla).append("<input type='hidden' name='empresas[].codigo' value='"+codigo+"'/>"

--
Chico Sokol

[Marcos Filho]

axo que essa será uma possível solução( vou testar ela agora), antes
de mais nada é possivel em vez de passar no form eu setar esse
atributo em um array javascript? tipo data[i] que conterá esses
codigos?

[Chico Sokol]

Você pode guardar em um array no javascript e enviar por ajax pelo jquery.

--
Chico Sokol

[Marcos Filho]

sem querer ser chato como eu poderia guardar nesse array? estou
aprendendo javascript e jquery aos poucos acompanhando a api, poderia
dar um caminho de como eu poderia fazer isso? o envio acho que sei
como fazer mais o "guardar" é que estou confuso.

[Chico Sokol]

Marcos, acho que o melhor jeito de fazer é mesmo colocando os elementos novos no form. De qualquer forma, você pode guardar os dados em um array global mesmo e depois mandar por ajax.

--
Chico Sokol