AJAX - recarregar uma parte de uma página web sem o uso de um arquivo separado para carga
-
03-07-2019 - |
Pergunta
Título pode ser um pouco confuso, então deixe-me explicar.
Eu tenho um site que tem um painel lateral, que contém informações sobre o usuário, as coisas que o usuário pode fazer, etc. Quando o usuário não está logado, este painel lateral se torna a área para registro ou inscrição.
O código para isso é:
<?php
if($user->loggedIn)
{
?>
<!-- side-panel for logged in users here -->
<?php
}
else
{
?>
<!-- login/registration etc -->
<?php
}
?>
O que eu quero fazer é carregar esse trecho de código novamente quando o usuário clica o login com AJAX, e usar um efeito jQuery (provavelmente se desvaneça) que suavemente faz a transição do painel lateral de login / inscrição para os usuários somente brilhantes painel.
Eu sei que eu poderia fazer isso se eu colocar esse código em outro arquivo e carregá-la através de AJAX para o div para painel lateral ... mas eu preferiria não fazer um arquivo separado por apenas painel lateral. Isso é possível?
Solução
Você poderia carregar a página com um pedido de AJAX e, em seguida, retirar os outros do que o painel lateral de dados, mas o que seria o ponto? Sua melhor opção seria a de simplesmente separar o painel lateral em seu próprio arquivo.
Oh, e que também seria considerado a maneira correta de fazê-lo, para que possa editar a barra lateral sem editar as páginas que ocorre em.
Outras dicas
Se bem entendi o que você neey, você pode tentar desta forma:
$.ajax({
type: "GET",
url: "url", // replace 'url' with your url
cache: false,
success: function(data){
alert($(data).find('#sidebar').html());
}
});
Talvez irá trabalhar com $ .load () ou $ .get (), não sei.
Por que você está invés de manter o painel lateral em seu próprio arquivo? Mantém as coisas mais modular e organizado.
Se você realmente se opõem à manutenção do conteúdo de um arquivo, você pode colocar o conteúdo em um banco de dados e consulta para ele sempre que a chamada AJAX é feita.
Você poderia passar um parâmetro string de consulta para a página e, em seguida, com base em que apenas fazer um parcial render (barra lateral somente) da página? Em seguida, basta usar o seu método normal jquery / ajax e incluem a paramater string de consulta.
$.ajax(function(){
url: MyPage.php?sidebar_only=true
ect...
})
Assumindo que você estará recebendo os dados do usuário real através de uma outra chamada, você poderia usar duas divs. A div que contém o html para o painel de usuário inicia escondido. Quando você começa um login bem-sucedido, esconder a div login e mostrar a div painel de usuário. Usando os dados do login do AJAX, preencha a informação do costume painel. Presumo que a chamada de login AJAX irá retornar as informações necessárias para preencher o nome de usuário e que eles podem fazer. Isso só faz isso para que você não tem que puxar o html para o painel de usuário inteiro.