2

Estou tentando fazer uma função para carregar um conteúdo com .load() do jQuery, o .load() recebe um parâmetro param que seria o endereço do arquivo.
E gostaria que esse html fosse carregado após um elemento especifico, no caso aside.
Tentei utilizando o método .after() mas não consegui, gostaria de saber se alguém tem alguma solução?!

E tenho outra dúvida, após carregar esse conteúdo novo, se os métodos que estão dentro do $(document).ready(); ainda irão funcionar, para interagir com os novos elementos carregados?!

Linha HTML onde está o evento onclick

<li class="list-group-item pointer" onclick="getTemplate('admin/email/lista-emails.php')">
  Lista de E-mails
  <span class="indicador success white right">14</span>
</li>

Código Javascript

function getTemplate(string){
  $("#here").after().load(string);
}

Obs: Ele carregou o conteúdo dentro do aside

2
  • Qual erro é apresentado no console?
    – Asura Khan
    Commented 21/02/2017 às 3:00
  • Desculpe, esqueci de informar... Ele carregou o conteúdo dentro do aside Commented 21/02/2017 às 3:13

3 Respostas 3

2

Você pode usar $.get() para buscar o conteúdo e insertAfter() para posicioná-lo, ao invés de load() e after();

function getTemplate(string){
  var html = $.get( string );
  $( html ).insertAfter('#here');
}

3
  • Consegui trazer atraves de uma chamada ajax, que fiz, mas ao utilizar esse método que insertAfter, ele me retornou esse erro: Uncaught TypeError: Cannot read property 'ownerDocument' of undefined Commented 22/02/2017 às 1:31
  • quando vc chama $.get( string ) ele tem que retornar um html bem formatado, senão pode dar esse erro Commented 22/02/2017 às 1:36
  • E como eu iria pegar esse html do objeto retornado e inserir após o #here, ele traz o html no responseText Commented 22/02/2017 às 1:55
0

Poderia ser feito utilizando done do $.getJSON();

Assim:

funtion getTemplate(parametro){
  $.getJSON("url", data : {paramentronome : paramento }).
   .done(function (dado ) {
      $("#div").html(dado);
   });
}

Isso ajuda?

3
  • Vlw mas atraves de suas respostas montei uma chamada ajax, agora falta inserir o conteudo depois da tag #here Commented 22/02/2017 às 1:32
  • A sua tag #here, você quer adicionar o conteudo nela? É isso, eu não entendi direito o que seria essa tag e o que seria feito com ela ... Se for para adicionar o conteudo nela seria $("#here").html("texto"); // adiciona um html novo $("#here").append("texto"); // adiciona um texto ao que ja existia Commented 22/02/2017 às 10:43
  • Vlw já consegui resolver, queria carregar o conteudo depois da tag. Commented 22/02/2017 às 15:41
0

Consegui resolver da seguinte forma:

function getTemplate(string){
  $.ajax({
    type     : 'GET',
    url      : string,
    dataType : 'html',
    success  : function(data){
      //remove o conteudo caso já tenha carregado
      //e evita carregar multiplas vezes o mesmo conteudo
      $("#loadContent").remove(); 
      //carrega o html após o elemento ASIDE que resultou na consulta.
      $('aside').after(data);
    }
  });
}
1
  • Se alguma resposta resolveu, marque com o V verdinho ao lado dela (mesmo que seja essa sua mesmo) para marcar como resolvido, em vez de editar o titulo.
    – Largato
    Commented 22/02/2017 às 2:27

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .