Obter novo html sem mudar de página

rubenbrito · April 19, 2012 at 10:53 PM

Boas.

É assim:

Imaginando que tenho um site php, estou na página index.php, e na área a vermelho (link da imagem em baixo) apenas o código include("novidades.php");

E quando clico em "Produtos" queria que o script "novidades.php" fosse substituído pelo "produtos.php" sem ter que mudar de página.

Como devo fazer ? Alguém que me dê uma orientaçãozinha 🙂

Obrigado, Cumprimentos! 😄

http://imageshack.us/photo/my-images/811/97800002.jpg/

apenas tenho o código

-- (brunoais)

Para a próxima, edita o post, não cries um outro .

KTachyon · April 19, 2012 at 11:14 PM

PHP é server side. Executa no servidor. Para fazeres isso tens que utilizar uma linguagem client side (ou browser side) tipo Javascript, que te faça o pedido ao servidor e substitua o div pelo que vier como resposta.

kya · April 19, 2012 at 11:40 PM

Versáo simplificada tirada da cabeça sem testar.

1 - inclui o jquery na página

2 - no tab do site (produtos por exemplo) um evento onclick

<div onclick="mostraProdutos();">Produtos</div>

Imaginemos que o div onde queres que apareçam os produtos tem o id="resultado"


var mostrarProdutos = function(){

   $.get(
       "produtos.php",
       function(data) { 
        $('#resultado').html(data);
      },
   )

}

Se quiseres mais funcionalidades investiga:

http://api.jquery.com/jQuery.ajax/

ruiFernandes · April 20, 2012 at 01:27 PM

Boas, podes usar algo assim, como o que fiz agora

<html>
<head><title>Menu</title>
	<script type="text/javascript">
		function aoCarregar(){
			document.getElementById('produtos').style.display = "none";
		}
		function escondeTudo(){
			document.getElementById('inicio').style.display = "none";
			document.getElementById('produtos').style.display = "none";
		}
		function abrirPag(nome){
			escondeTudo();
			document.getElementById(nome).style.display = "block";
		}
	</script>
	<style type="text/css">
		#menu{list-style:none;}
		#menu li{display:inline;margin-left:20px;}
	</style>
</head>
<body onload="javascript:aoCarregar();">
	<ul id="menu">
		<li><a href="javascript:void();" onclick="javascript:abrirPag('inicio');">INICIO</a></li>
		<li><a href="javascript:void();" onclick="javascript:abrirPag('produtos');">PRODUTOS</a></li>
	</ul>
	<hr/>
	<div id="inicio">INICIO!</div>
	<div id="produtos">PRODUTOS!</div>
</body>
</html>

e no conteúdo da página fazes o include da página php.

Cumps,

Rui Fernandes

rubenbrito · April 25, 2012 at 03:48 PM

Muito obrigado pela ajuda Rui Fernandes 😉

ruiFernandes · April 26, 2012 at 11:23 AM

de nada 🙂 , na função aoCarregar podes pôr antes a escondeTudo e a abrirPag a abrir a que queres abrir de inicio ficando assim

function aoCarregar(pagInicio){
    escondeTudo();
    abrirPag(pagInicio);
}

e ao chamar a aoCarregar no onLoad escreves como parametro o nome da div que queres que abra em primeiro

Cumps,

Rui Fernandes

KTachyon · April 26, 2012 at 05:40 PM

Eu só acho que entretanto este tópico deixou de fazer sentido estar na secção de PHP. Penso que a continuação da dúvida deveria ter sido colocada e respondida na secção de Javascript.

Anyway, alterar o título do tópico também seria altamente recomendado.

Th3Alchemist · April 26, 2012 at 09:29 PM

Eu só acho que entretanto este tópico deixou de fazer sentido estar na secção de PHP. Penso que a continuação da dúvida deveria ter sido colocada e respondida na secção de Javascript.

Anyway, alterar o título do tópico também seria altamente recomendado.

Também é possível em PHP, e até achava mais simples, do género:

links no formato

index.php?page=produtos

e mais a frente:

$page = $_GET['page'];

include '$page'.'.php';

ruiFernandes · April 26, 2012 at 10:02 PM

não leste direito o primeiro post, ele queria que o conteúdo muda-se, sem mudar de página.

Sign In

Obter novo html sem mudar de página

Recommended Posts

rubenbrito

KTachyon

kya

ruiFernandes

rubenbrito

ruiFernandes

KTachyon

Th3Alchemist

ruiFernandes

Create an account or sign in to comment

Create an account

Sign in

Home

Activity

Revista PROGRAMAR

Important Information