AJAX - recarregar uma parte de uma página web sem o uso de um arquivo separado para carga

Question

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?

Answer 1

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.

Answer 2

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.

Answer 3

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.

Answer 4

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...
})

Answer 5

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.