Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Lord Humberto

Carregar conteudo dentro de div já carregada por ajax

Por , em Javascript

Recommended Posts

Lord Humberto    0

Lord Humberto
Postado

Boa noite,

 

Sou novo aki... e vou tentar explicar meu problema...

 

Tenho um codigo em ajax que carrega um determinada pagina (pagina1.php) dentro de uma div (conteudo)...

Dentro da pagina1.php tem outra div (comentario)...

quando eu tento carregar outra pagina (pagina2.php) dentro da div comentario aparece uma mensagem falando que o elemento é nulo...

soh consigo carregar informçoes e paginas dentro da pagina principal...

tem alguma soluçao plausivel para este problema?

 

grato.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Daniel-DF    0

Daniel-DF
Postado

Em jquery existem as funções live e bind que servem para justamente isso.

Elas preservam o evento carregado para objetos incorporados depois do carregamento da página (ajax).

Compartilhar este post

Link para o post
Compartilhar em outros sites

Lord Humberto    0

Lord Humberto
Postado

Em jquery existem as funções live e bind que servem para justamente isso.

Elas preservam o evento carregado para objetos incorporados depois do carregamento da página (ajax).

 

 

Ola Daniel,

 

Infelizmente nao tenho muito conhecimento em jquery, teria como postar um exemplo de uso para que eu possar analisar?

 

grato.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Dee    0

Dee
Postado

Posta o código ae!

Mas pelo jeito, você ta carregando uma página em um elemento que nao existe.

Como está no link ? E a Div, está com o Id Correto ?

Compartilhar este post

Link para o post
Compartilhar em outros sites

Lord Humberto    0

Lord Humberto
Postado

Posta o código ae!

Mas pelo jeito, você ta carregando uma página em um elemento que nao existe.

Como está no link ? E a Div, está com o Id Correto ?

 

 

Ola... segue abaixo o link do codigo

 

Clique aqui

 

o problema está no comentário... quando o usuario faz o comentário da noticia... eh solicitado a requisiçao ajax

para mostrar os comentarios existentes logo abaixo do formulário, mas a requisiçao nao acha a div.... que está dentro da pagina ja carregada por ajax.

 

 

grato.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Lord Humberto    0

Lord Humberto
Postado

ajax...

try {
 this.xmlhttp = new XMLHttpRequest();
 } 
 
 //cria o objeto XMLHttpRequest pra IE 6.0 e posteriormente para IE7+
 catch (e) {
 try {
 this.xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
 } 
 
 catch (e) {
 this.xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
 }
 }

var ajax = {

cadastraComentario : function(){
		param = ajax.camposForm(document.form_comentario.elements);
		if(validarFomComentario()){
			xmlhttp.open('POST', 'coment.php', true);
			xmlhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
			xmlhttp.onreadystatechange = ajax.repostasComentario;
			xmlhttp.send(param);
		}
		
	},
	
	repostasComentario : function(){
		
		if(xmlhttp.readyState == 4) {
			if(xmlhttp.status == 200) {
				ajax.listaCometario();
				document.form_comentario.reset();
			}
		}
		
	},
	
	listaCometario : function(){
		
		id = document.getElementById('intNotID').value;
		local = document.getElementById('comentarios');
		xmlhttp.open('GET', 'comentarios.php?not_id='+id, true);
		xmlhttp.onreadystatechange = function(){
			if(xmlhttp.readyState == 4) {
				if(xmlhttp.status == 200)
					local.innerHTML = xmlhttp.responseText;
			}
		}
		xmlhttp.send(null);
		
	}
}

pagina principal

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Orações</title>
	<script language="javascript" type="text/javascript" src="portal_noticia/js/ajaxnoticia.js"></script>

	<link href="css/conteudo.css" rel="stylesheet" type="text/css" />
	<link href="portal_noticia/css/principal2.css" rel="stylesheet" type="text/css" />
</head>
<body onload="ajax.carregarPagina('portal_noticia/portal_noticia.php', 'conteudo')">
<a href="javascript:void(0);" onclick="ajax.carregarPagina('portal_noticia/portal_noticia.php', 'conteudo')"> carregar</a>
<div id="conteudo" ></div>
</body>
</html>

pagina requisitada por ajax

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Portal de Notícias</title>
<script src="../script/script.js" type="text/javascript">/**/</script>
<link href="css/principal2.css" rel="stylesheet" type="text/css" />
<link href="../css/conteudo.css" rel="stylesheet" type="text/css" />
<script language="javascript" type="text/javascript" src="js/anima.js"></script>
<script language="javascript" type="text/javascript" src="js/ajax.js"></script>
</head>

<body>
<div id="global">
<div id="conteudo" >
	<div id="topo_not">
		<h1>Portal de Notícias</h1>
	</div>
	<h2><em><?php echo $noticia[1]; ?></em></h2>
	<br />
	<?php if($noticia[7]){ ?><img src="<?php echo $pastaPadrao; ?>galeria/<?php echo $noticia[7]; ?>" width="300px" style="padding: 10px;" align="left" /><?php }?>
	<p><?php echo nl2br($noticia[2]); ?></p>
	<p><em><strong>Fonte: </strong><?php echo $noticia[5]; ?></em></p>
	<p><strong>Publicada em: </strong><?php echo $noticia['data']; ?> <strong>por</strong> <?php echo $noticia[9]; ?></p>
	<br />
	<div align="center">	
		<a href="<?php echo $pastaPadrao; ?>noticia-imprimir.php?not_id=<?php echo $noticia[0]; ?>" onclick="window.open('','pop','scrollbars=yes,width=600,height=600')" target=pop class="botao"> <img src="<?php echo $pastaPadrao; ?>img/imprimir.png" alt="imprimir" />Imprimir esta notícia</a>
		   |   
		<a href="<?php echo $pastaPadrao; ?>noticia-email.php?not_id=<?php echo $noticia[0]; ?>" onclick="window.open('','pop','scrollbars=no,width=300,height=200')" target=pop class="botao"> <img src="<?php echo $pastaPadrao; ?>img/enviar.png" alt="enviar" />Indicar esta notícia</a>
	</div>
	<br />
<?php include("ultimasnoticias.php"); ?>
		<div align="center" style="padding-top:6px">
			<span class="stylefont20">Comente esta Notícia</span>
			
			<form action="return false" method="post" enctype="application/x-www-form-urlencoded" id="form_comentario" name="form_comentario">
				<table>
                	<tr valign="baseline">
                  		<td align="right">Nome:</td>
                  		<td><input type="text" class="formcomentario" name="strComAuthor" id="strComAuthor" value="" size="32" onfocus="ajax.realcaCampo(this.name, 1)" onblur="ajax.realcaCampo(this.name, 0)" /></td>
                	</tr>
                	<tr valign="baseline">
                  		<td align="right">E-mail:</td>
                  		<td><input type="text"  class="formcomentario" name="strComAuthorEmail" id="strComAuthorEmail" value="" size="32" onfocus="ajax.realcaCampo(this.name, 1)" onblur="ajax.realcaCampo(this.name, 0)" /></td>
                	</tr>
                	<tr valign="baseline">
                  		<td align="right" valign="top">Texto:</td>
                  		<td><textarea name="strComText"  class="formcomentario" id="strComText" cols="25" rows="5" onkeydown="ContarCaracteres(this,this.form.contador,200)" onkeyup="ContarCaracteres(this,this.form.contador,200)" onfocus="ajax.realcaCampo(this.name, 1)" onblur="ajax.realcaCampo(this.name, 0)" ></textarea><br />
	 						<input type='text' size='4' name='contador' id='contador' value='200' style='border: none; text-align: right' readonly='readonly' />
      </script> caracteres restantes
						</td>
                	</tr>
                	<tr valign="baseline">
						<td align="right"> </td>
						<td><div align="center">
						<input type="button" class="enviar" onmouseover="this.className = 'enviardown';" onmouseout="this.className = 'enviar';" onclick="ajax.cadastraComentario();" value="Enviar" />

                      	      <input name="Limpar" type="reset" value="Limpar" class="enviar" onmouseover="this.className = 'enviardown';" onmouseout="this.className = 'enviar';" /> </div></td>
                	</tr>
              	</table>
			  	<input type="hidden" name="intNotID" id="intNotID" value="<?php echo $noticia[0]; ?>" />
			</form>
			<br />
		</div>
		<div id="comentarios" nome="comentarios" style="width:320px; margin-top:0px; margin-bottom: 0px; margin-left:auto; margin-right:auto; text-align: left;">
<?php
include("comentarios.php");
?>
		
		</div>
		<br /><br /><br />
	</div>
</div>
</body>
</html>

pagina requisitada pela pagina anterior referente aos comentarios

echo '
<h3>Comentários da notícia</h3>
<br />
<table width="100%">';

while($s = mysql_fetch_array($sql)){
$achou = true;
echo '
	<tr>
		<td>
        	<span class="stylefont14"><b>Por <a href="mailto:'.$s[2].'">'.$s[1].'</a> em '.$s[6].' </b><br />
        	'.$s[3].' </span>
		</td>
	</tr>
	<tr>
		<td align="right" style="border-bottom: 1px groove #000066;">
			<a id="cometario'.$s[0].'" class="botao" onclick="ajax.denunciarComentario('.$s[0].');"> <img src="'.$pastaPadrao.'img/alerta.png" alt="alerta" width="18" /> Denunciar </a>
		<div style="height:7px;"> </div>
		</td>
	</tr>';
}
if(!$achou)	echo '<tr> <td> <span class"stylefont14"><em><b> Sem Comentários </b></em></span> </td></tr>';
echo '</table>';

Compartilhar este post

Link para o post
Compartilhar em outros sites

Dee    0

Dee
Postado

É aqui que está acusando que nao acha a DIV?

     listaCometario : function(){
                
                id = document.getElementById('intNotID').value;
                local = document.getElementById('comentarios');
                xmlhttp.open('GET', 'comentarios.php?not_id='+id, true);
                xmlhttp.onreadystatechange = function(){
                        if(xmlhttp.readyState == 4) {
                                if(xmlhttp.status == 200)
                                        local.innerHTML = xmlhttp.responseText;
                        }
                }
                xmlhttp.send(null);
                
        }

Nao tem que chamar essa função ??

Onde ta chamando ela ?

Ou ela carrega sozinha ?

Compartilhar este post

Link para o post
Compartilhar em outros sites

Lord Humberto    0

Lord Humberto
Postado

É aqui que está acusando que nao acha a DIV?

     listaCometario : function(){
                
                id = document.getElementById('intNotID').value;
                local = document.getElementById('comentarios');
                xmlhttp.open('GET', 'comentarios.php?not_id='+id, true);
                xmlhttp.onreadystatechange = function(){
                        if(xmlhttp.readyState == 4) {
                                if(xmlhttp.status == 200)
                                        local.innerHTML = xmlhttp.responseText;
                        }
                }
                xmlhttp.send(null);
                
        }

Nao tem que chamar essa função ??

Onde ta chamando ela ?

Ou ela carrega sozinha ?

 

 

no codigo ajax...

eu chamo a funçao cadastrar comentario... esta por sua vez chama respostacomentario que chama a funçao lista comentario...

porem o erro esta na funçao lista comentario que nao localiza a div comentario

linha de codigo com problema:

local = document.getElementById('comentarios');

Compartilhar este post

Link para o post
Compartilhar em outros sites

Lord Humberto    0

Lord Humberto
Postado

e se você colocar

var local = document.getElementById("comentarios");

o meu problema que o ajax nao localiza a div "cometarios", se ele nao localiza a div o ajax nao tem onde jogar os dados...

o retorno que tenho eh que a variavel e nulo...

Compartilhar este post

Link para o post
Compartilhar em outros sites

Henrique Barcelos    290

Henrique Barcelos
Postado

http://forum.imasters.com.br/public/style_emoticons/default/seta.gif http://www.comp.ufscar.br/~henriquejpb/myJS/myAjax.php

 

Veja o exemplo #3...

 

Se tiver mais dúvidas, baixe a documentação...

 

Caso persistam suas dúvidas, poste aqui...

 

É bem simples de usar, não requer tanto conhecimento quanto jQuery

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito