AJAX - перезагрузить часть веб-страницы без использования отдельного файла для загрузки

Question

Название может быть немного запутанным, поэтому позвольте мне объяснить.

У меня есть веб-сайт с боковой панелью, которая содержит информацию о пользователе, действиях пользователя и т. Д. Когда пользователь не вошел в систему, эта боковая панель становится областью для входа или регистрации.

Код для этого:

<?php
if($user->loggedIn)
{
?>
<!-- side-panel for logged in users here -->
<?php
}
else
{
?>
<!-- login/registration etc -->
<?php
}
?>

Что я хочу сделать, так это снова загрузить этот фрагмент кода, когда пользователь нажимает на кнопку входа в систему с помощью AJAX, и использовать эффект jQuery (возможно, исчезающий), который плавно переводит боковую панель с входа в систему / регистрации на блестящие только для пользователей панель.

Я знаю, что мог бы сделать это, если бы я поместил этот код в другой файл и загрузил его через AJAX в div для боковой панели ... но я бы не хотел делать отдельный файл только для боковой панели. Это возможно?

Answer 1

Вы можете загрузить страницу с помощью запроса AJAX, а затем удалить данные, отличные от боковой панели, но какой в ​​этом смысл? Лучшим вариантом будет просто разделить боковую панель на отдельный файл.

О, и это также будет считаться правильным способом сделать это, так что вы можете редактировать боковую панель, не редактируя страницы, на которых она появляется.

Answer 2

Не могли бы вы передать параметр строки запроса на страницу, а затем на основании этого сделать только частичный рендеринг (только боковая панель) страницы? Затем просто используйте ваш обычный метод jquery / ajax и включите параметр строки запроса.

$.ajax(function(){
    url: MyPage.php?sidebar_only=true
    ect...
})

Answer 3

Предполагая, что вы будете получать фактические данные пользователя через другой вызов, вы можете использовать два div. Div, содержащий html для пользовательской панели, начинает скрываться. Когда вы получите успешный вход в систему, скройте div входа в систему и покажите div панели пользователя. Используя данные из логина AJAX, заполните пользовательскую информацию панели. Я предполагаю, что входящий вызов AJAX вернет необходимую информацию для ввода имени пользователя и того, что он может сделать. Это просто делает так, что вам не нужно использовать html для всей пользовательской панели.

Answer 4

Почему вы против сохранения боковой панели в своем собственном файле? Делает вещи более модульными и организованными.

Если вы действительно против сохранения содержимого в файле, вы можете поместить его в базу данных и запрашивать его при каждом вызове AJAX.

Answer 5

Если я правильно понимаю, что вы, ней, вы можете попробовать следующим образом:

$.ajax({
    type: "GET",
    url: "url", // replace 'url' with your url
    cache: false,
    success: function(data){
        alert($(data).find('#sidebar').html());
    }
});

Может работать с $ .load () или $ .get (), не знаю