Skip to main content
adicionou 2 caracteres ao conteúdo
Fonte Link
Andrei Coelho
  • 6,4mil
  • 2
  • 19
  • 40

Esse é o problemaum dos problemas.

Antes de você inserir a tabela com a lista que foi criada no php usando o ajax, esta lista, não existia. Mas o código do evento click foi "carregado" junto com o html inicial:

$('div#espaco-detalhes tr td button').click(function(e)
{           
    e.preventDefault();
    
    var botao = $(this).attr('id');
    var retorno = pesquisarDetalhes(botao);
        
});
  1. Esse evento está errado: $('div#espaco-detalhes tr td button').click(function(e).. pois não há uma lista neste local. O correto é $('#registros-atividades tr td button').click(function(e)..

  2. Após a alteração anteriro, é necessário inserir o evento após a criação da lista, pois antes de você inserir a tabela com a lista que foi criada no php usando o ajax, esta lista, não existia, portanto o código não tem referências desta nova lista no DOM. Então, o click, simplesmente não funciona. E como o click não funciona, o ajax não é acionado.

Depois que a lista é inserida, oSeu código anterior não tem referências desta nova lista no DOM. Então, o click, simplesmente não funciona. E como o click não funciona, o ajax não é acionado.

Solução

Uma solução simples é você inserir esse evento após a inserção da lista. Assimficaria assim:

Esse é o problema.

Antes de você inserir a tabela com a lista que foi criada no php usando o ajax, esta lista, não existia. Mas o código do evento click foi "carregado" junto com o html inicial:

$('div#espaco-detalhes tr td button').click(function(e)
{           
    e.preventDefault();
    
    var botao = $(this).attr('id');
    var retorno = pesquisarDetalhes(botao);
        
});

Depois que a lista é inserida, o código anterior não tem referências desta nova lista no DOM. Então, o click, simplesmente não funciona. E como o click não funciona, o ajax não é acionado.

Solução

Uma solução simples é você inserir esse evento após a inserção da lista. Assim:

Esse é um dos problemas.

  1. Esse evento está errado: $('div#espaco-detalhes tr td button').click(function(e).. pois não há uma lista neste local. O correto é $('#registros-atividades tr td button').click(function(e)..

  2. Após a alteração anteriro, é necessário inserir o evento após a criação da lista, pois antes de você inserir a tabela com a lista que foi criada no php usando o ajax, esta lista, não existia, portanto o código não tem referências desta nova lista no DOM. Então, o click, simplesmente não funciona. E como o click não funciona, o ajax não é acionado.

Seu código ficaria assim:

adicionou 2 caracteres ao conteúdo
Fonte Link
Andrei Coelho
  • 6,4mil
  • 2
  • 19
  • 40

Eu já fiz um código ajax para fazer isso, só que não está dando certo. Acho que pelo motivo dos serem preenchidos dinamicamente na tabela

Esse é o problema.

Antes de você inserir a tabela com a lista que foi criada no php usando o ajax, esta lista, não existia. Mas o código do evento click foi "carregado" junto com o html inicial:

$('div#espaco-detalhes tr td button').click(function(e)
{           
    e.preventDefault();
    
    var botao = $(this).attr('id');
    var retorno = pesquisarDetalhes(botao);
        
});

Depois que a lista é inserida, o código anterior não tem referências desta nova lista no DOM. Então, o click, simplesmente não funciona. E como o click não funciona, o ajax não é acionado.

Solução

Uma solução simples é você inserir esse evento após a inserção da lista. Assim:

$.each($.parseJSON(data), function(chave, valor)
{                       
    atividades += '<tr value="'+ valor.codigo +'">';
    atividades += '<td>' + valor.COD + '</td>';
    atividades += '<td>' + valor.EMPRESAS + '</td>';
    atividades += '<td>' + valor.TRIBUTACAO + '</td>';
    atividades += '<td>' + valor.TIPO_ATIVIDADE + '</td>';
    atividades += '<td>' + valor.STATUS + '</td>';
    atividades += '<td>' + valor.DT_VENCIMENTO + '</td>';
    atividades += '<td>' + valor.DT_INICIO + '</td>';
    atividades += '<td>' + valor.DT_FIM + '</td>';
    atividades += '<td>' + valor.codigo + '</td>';
    //atividades += '<td><button class="btn-warning" value="'+ valor.codigo +'">Detalhes</button></td>';
    atividades += '<td><button class="btn-warning" id="'+ valor.codigo +'">Detalhes</button></td>';
    atividades += '</tr>';
});

$('#registros-atividades').html(atividades); // insere a lista
// INSERE O EVENTO DE "CLICK" APÓS A ALTERAÇÃO NO HTML
$('div#espaco'#registros-detalhesatividades tr td button').click(function(e)
{           
    e.preventDefault();
    
    var botao = $(this).attr('id');
    var retorno = pesquisarDetalhes(botao);
        
});

Eu já fiz um código ajax para fazer isso, só que não está dando certo. Acho que pelo motivo dos serem preenchidos dinamicamente na tabela

Esse é o problema.

Antes de você inserir a tabela com a lista que foi criada no php usando o ajax, esta lista, não existia. Mas o código do evento click foi "carregado" junto com o html inicial:

$('div#espaco-detalhes tr td button').click(function(e)
{           
    e.preventDefault();
    
    var botao = $(this).attr('id');
    var retorno = pesquisarDetalhes(botao);
        
});

Depois que a lista é inserida, o código anterior não tem referências desta nova lista no DOM. Então, o click, simplesmente não funciona. E como o click não funciona, o ajax não é acionado.

Solução

Uma solução simples é você inserir esse evento após a inserção da lista. Assim:

$.each($.parseJSON(data), function(chave, valor)
{                       
    atividades += '<tr value="'+ valor.codigo +'">';
    atividades += '<td>' + valor.COD + '</td>';
    atividades += '<td>' + valor.EMPRESAS + '</td>';
    atividades += '<td>' + valor.TRIBUTACAO + '</td>';
    atividades += '<td>' + valor.TIPO_ATIVIDADE + '</td>';
    atividades += '<td>' + valor.STATUS + '</td>';
    atividades += '<td>' + valor.DT_VENCIMENTO + '</td>';
    atividades += '<td>' + valor.DT_INICIO + '</td>';
    atividades += '<td>' + valor.DT_FIM + '</td>';
    atividades += '<td>' + valor.codigo + '</td>';
    //atividades += '<td><button class="btn-warning" value="'+ valor.codigo +'">Detalhes</button></td>';
    atividades += '<td><button class="btn-warning" id="'+ valor.codigo +'">Detalhes</button></td>';
    atividades += '</tr>';
});

$('#registros-atividades').html(atividades); // insere a lista
// INSERE O EVENTO DE "CLICK" APÓS A ALTERAÇÃO NO HTML
$('div#espaco-detalhes tr td button').click(function(e)
{           
    e.preventDefault();
    
    var botao = $(this).attr('id');
    var retorno = pesquisarDetalhes(botao);
        
});

Eu já fiz um código ajax para fazer isso, só que não está dando certo. Acho que pelo motivo dos serem preenchidos dinamicamente na tabela

Esse é o problema.

Antes de você inserir a tabela com a lista que foi criada no php usando o ajax, esta lista, não existia. Mas o código do evento click foi "carregado" junto com o html inicial:

$('div#espaco-detalhes tr td button').click(function(e)
{           
    e.preventDefault();
    
    var botao = $(this).attr('id');
    var retorno = pesquisarDetalhes(botao);
        
});

Depois que a lista é inserida, o código anterior não tem referências desta nova lista no DOM. Então, o click, simplesmente não funciona. E como o click não funciona, o ajax não é acionado.

Solução

Uma solução simples é você inserir esse evento após a inserção da lista. Assim:

$.each($.parseJSON(data), function(chave, valor)
{                       
    atividades += '<tr value="'+ valor.codigo +'">';
    atividades += '<td>' + valor.COD + '</td>';
    atividades += '<td>' + valor.EMPRESAS + '</td>';
    atividades += '<td>' + valor.TRIBUTACAO + '</td>';
    atividades += '<td>' + valor.TIPO_ATIVIDADE + '</td>';
    atividades += '<td>' + valor.STATUS + '</td>';
    atividades += '<td>' + valor.DT_VENCIMENTO + '</td>';
    atividades += '<td>' + valor.DT_INICIO + '</td>';
    atividades += '<td>' + valor.DT_FIM + '</td>';
    atividades += '<td>' + valor.codigo + '</td>';
    //atividades += '<td><button class="btn-warning" value="'+ valor.codigo +'">Detalhes</button></td>';
    atividades += '<td><button class="btn-warning" id="'+ valor.codigo +'">Detalhes</button></td>';
    atividades += '</tr>';
});

$('#registros-atividades').html(atividades); // insere a lista
// INSERE O EVENTO DE "CLICK" APÓS A ALTERAÇÃO NO HTML
$('#registros-atividades tr td button').click(function(e)
{           
    e.preventDefault();
    
    var botao = $(this).attr('id');
    var retorno = pesquisarDetalhes(botao);
        
});
Fonte Link
Andrei Coelho
  • 6,4mil
  • 2
  • 19
  • 40

Eu já fiz um código ajax para fazer isso, só que não está dando certo. Acho que pelo motivo dos serem preenchidos dinamicamente na tabela

Esse é o problema.

Antes de você inserir a tabela com a lista que foi criada no php usando o ajax, esta lista, não existia. Mas o código do evento click foi "carregado" junto com o html inicial:

$('div#espaco-detalhes tr td button').click(function(e)
{           
    e.preventDefault();
    
    var botao = $(this).attr('id');
    var retorno = pesquisarDetalhes(botao);
        
});

Depois que a lista é inserida, o código anterior não tem referências desta nova lista no DOM. Então, o click, simplesmente não funciona. E como o click não funciona, o ajax não é acionado.

Solução

Uma solução simples é você inserir esse evento após a inserção da lista. Assim:

$.each($.parseJSON(data), function(chave, valor)
{                       
    atividades += '<tr value="'+ valor.codigo +'">';
    atividades += '<td>' + valor.COD + '</td>';
    atividades += '<td>' + valor.EMPRESAS + '</td>';
    atividades += '<td>' + valor.TRIBUTACAO + '</td>';
    atividades += '<td>' + valor.TIPO_ATIVIDADE + '</td>';
    atividades += '<td>' + valor.STATUS + '</td>';
    atividades += '<td>' + valor.DT_VENCIMENTO + '</td>';
    atividades += '<td>' + valor.DT_INICIO + '</td>';
    atividades += '<td>' + valor.DT_FIM + '</td>';
    atividades += '<td>' + valor.codigo + '</td>';
    //atividades += '<td><button class="btn-warning" value="'+ valor.codigo +'">Detalhes</button></td>';
    atividades += '<td><button class="btn-warning" id="'+ valor.codigo +'">Detalhes</button></td>';
    atividades += '</tr>';
});

$('#registros-atividades').html(atividades); // insere a lista
// INSERE O EVENTO DE "CLICK" APÓS A ALTERAÇÃO NO HTML
$('div#espaco-detalhes tr td button').click(function(e)
{           
    e.preventDefault();
    
    var botao = $(this).attr('id');
    var retorno = pesquisarDetalhes(botao);
        
});