Elementos criados dinamicamente com JSON não são selecionados

[FILR@N 0]

Olá, pessoal!

 

Depois de alguns segundos ( setTimeout() ) eu preciso selecionar todos os elementos <li> que foram gerados via JSON.

<li name="msg" id="id_via_json" class="msg"> Texto via JSON </li>

Apenas com o seletor não estou conseguindo.

$(".msg").size();

Alguém pode me ajudar?

 

[William Bruno 1501]

Cara, é só isso mesmo.

 

Mostre como vc tentou fazer ?

[FILR@N 0]

William Bruno,

 

Para teste, fui mudando o fundo dos elementos pais, por exemplo:

$("#area").css("background-color","red");
$("#area li").css("background-color","red");
$("#area li ul").css("background-color","red");
$("#area li ul li").css("background-color","red");

Daí notei que só os elementos <li class="msg"> criados dinamicamente não eram selecionados.

Vi vários exemplos com eventos (change, click, hover...), mas não se aplica o que quero. Não pretendo selecionar quando houver algum evento de mouse, mas sim depois de um tempo com setTimeout.

[Everton Chapani 1]

setTimeout(function(){

//aqui faz a ação depois de contar o tempo dali de baixo

}, 2000);

Testa ai e veja se da certo :D

[FILR@N 0]

Pessoal, depois da dica do Everton eu fui implementando até que me deparei com outro problema.

 

A ideia do que eu quero é o seguinte:

1- A página é carregada com algumas mensagens via json.

2- Depois de alguns segundos, eu quero conferir se há alguma nova mensagem e se existir, inseri-la na página.

 

A lógica que implementei segue como:

postit_bd_id armazena a id das mensagens do json.

postit_canvas_id são as mgs que estão na página e que vieram do json.

postit_equal essa var guardo somente os id das mensagens que estão no bd e na página,

e por fim, removo as msgs que estão nos dois lados e deixo só as mensagens que foram add depois.

Ao final do script postit_bd_id possuirá as ids das msgs que preciso add à página.

 

Mas, tentei fazer um loop e chamar cada msg com uma url json. Ou seja, se eu tivesse 2 novas msgs seria um loop $.getJSON com urls diferentes. Não deu certo. Parece que não funciona $.getJSON aninhado.

 

Outra forma foi criar uma array multidimensional com todos os atributos da mensagem quando instancia a var postit_bd_id,mas também não deu certo.

 

Alguém me dá uma dica?

(function atualiza(){
	var time = 5000;
	var dominio = "http://localhost/project/";
	var project_id = $("#dados_projeto").attr("project_id");
	var canvas_id  = $("#dados_canvas").attr("canvas_id");
	var url = dominio+"projects/"+project_id+"/canvas_project/"+canvas_id+"/canvas_tickets.json";
	var postit_bd_id = [];
	var postit_canvas_id = [];
	var postit_equal = []; //armazena os indices dos postits iguais (postit_bd_id)
	var resp = "";
	
	$.getJSON(url,function(data){
		
		//1- ler todos os postits do BD
		for( i=0; i<data.length; i++ ){
			postit_bd_id[i] = data[i].id;
//			alert(postit_bd_id[i]); //TESTE
		}

		//2- ler todos os postits do canvas
		setTimeout(function(){
			$("#area .postit").each(function(index){
	//			alert( index ); //TESTE
				postit_canvas_id[index] = $(this).attr("postit-id");
//				alert( postit_canvas_id[index] );
			});

			//3- comparar se algum postit foi acrescentado
			for( i=0; i<postit_bd_id.length; i++ ){
	//			alert( postit_bd_id[i] );
				for( j=0; j<postit_canvas_id.length; j++  ){
//					alert( postit_canvas_id[j] );
					if( postit_canvas_id[j] == postit_bd_id[i] ){
//						$("li[postit-id='"+postit_canvas_id[j]+"']").css("background-color","red"); //TESTE
//						resp+= postit_bd_id[i]+" = "+postit_canvas_id[j]+"\n"; //TESTE
						postit_equal.push( postit_bd_id[i] );
					}
				}
			}
		
			if( postit_equal.length > 0 ){
				for( i=0; i<postit_equal.length; i++ ){
					//remove os postits antigos e deixa somente os novos
					index = postit_bd_id.indexOf( postit_equal[i] );
					postit_bd_id.splice(index, 1);
				}
			}

		},time);
   
              //tentei fazer o loop aqui

	});


	//4- tempo para atualizar
	setTimeout(atualiza,time);
}());

[FILR@N 0]

Enfim, por tanto pesquisar e quebrar a cabeça consegui resolver. Em vez de utilizar $.getJSON usei $.ajax com async:false.

 

Obrigado ao Everton e William pela preocupação em me ajudar.

	$.ajax({
		async: false,
		type: "GET",
		url: url,
		dataType: "json",
		success: function(json){
			for( i=0; i<json.length; i++ ){
				myArrayUm[i] = json[i].id;
			}
		}
	});