Ir para conteúdo

Arquivado

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

WictorP

Ajax.

Recommended Posts

Bom galerinha, eu queria fazer algo como nesse site

http://jornaldarcc.com.br

 

Veja as notícias, tópicos, etc, trocam ao clicar na seta, porém não usam Iframe, é por ajax.

Na verdade não comecei a desenvolver nada ainda, estou apenas com uma ideia e queria saber se estou no caminho certo.

 

Então minha ideia é colocar um onclick nas "setas" no qual ativaria o AJax que puxaria um outro arquivo php, que pegaria as querys e retornaria já o htmle php das notícias, ai eu apenas trocaria o HTML da div na pagina index.php com a tag .html do Jquery.

 

Não sei se me expressei direito, mas é isso ai . XD;

 

Se tiver alguma dica, um método mais fácil diz ai.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Se entendi, segue:

<div style='display:none;'>
	<img src="images/load.gif" />
</div>

<form name = "formulario" action="search_nome.php" method="POST">
	
	
	<!-- where our search value will be entered -->
	<input type="hidden" value = "valor" name="nome" id="fn" />
	<div id = "s-resultados">
	<!-- This is where our search results will be displayed -->
</div>

	<!-- This button will call our JavaScript Search functions -->
	<a href="#" type="submit" value="Carregar informações" id="search-nome" />Carregra informações</a>
</form>


<!-- import jQuery file -->

<script type = "text/javascript">
$(document).ready(function(){
	//load the current contents of search result
	$('#s-resultados').load('search_nome.php').show();
	
	
	$('#search-nome').click(function(){
		showValues();
	});
	
	$(function() {
		$('formulario').bind('submit',function(){
			showValues(); 
			return false; 
		});
	});
		
	function showValues() {
		//loader will be show until result from
		//search_results.php is shown
		$('#s-resultados').html('<p><img src="images/load.gif" /></p>');  
		
		//this will pass the form input
		$.post('search_nome.php', { nome; ?>: formulario.nome.value },
		
		//then print the result
		function(result){
			$('#s-resultados').html(result).show();
		});
	}
		
});
</script>
</body>
</div>
</div>
</div>

Esse é o Jquery que passa o id para a próxima página no caso search_nome.php.

A página recebe o id da index e faz a busca no banco de dados:

 

<?php
error_reporting(0);
include_once("config_open_db.php");

//define index
isset( $_REQUEST['name'] ) ? $name=$_REQUEST['name'] : $name='';

// just to escape undesirable characters
$name = mysql_real_escape_string( $name );

if( empty( $name )){
// this will be displayed if search value is blank
}else{
// this part will perform our database query
$sql = "select * from dados where id = '$name'";

$rs = mysql_query( $sql ) or die('Database Error: ' . mysql_error());
$num = mysql_num_rows( $rs );

if($num != 0 ){ //verifica se existe registro no banco
// se existir, Its Ok!
echo "Tem dados no banco de dados";
}else{
// if no records found
echo "<b>Name not found!</b>";
}
}
?>
Se não for Loading Data ajax que você quer, então você usa "DIV update whitout refresh", ele atualiza a cada segundo que você definir. O Facebook usa no Instagra e o Hello.com nas imagens deles. Espero ter ajudado!

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

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