Clever Geek Handbook

AJAX - reload part of a web page without using a separate file to load

The title can be a little confusing, so let me explain.

I have a website with a sidebar that contains information about the user, what the user can do, etc. When the user is not logged in, this sidebar becomes the area for login or registration.

Code for this:

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

What I want to do is load this piece of code again when the user clicks login with AJAX and uses a jQuery effect (probably disappears) that smoothly translates the transition from login / registration to shiny users panel.

I know I can do this if I put this code in another file and AJAX it in a div for the sidebar ... but I'd rather not make a separate file just for the sidebar. Is it possible?

+1


source to share


5 answers


You can load the page with an AJAX request and then remove non-sidebar data, but what's the point? Your best option is to simply separate the sidebar from your own file.



Oh, and this will also count as the correct way to do it, so you can edit the sidebar without editing the pages where it happens.

+3


source


If I understand what you are doing, you can try:

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


Might work with $ .load () or $ .get (), dunno.

0


source


Why are you against keeping the sidebar in your own file? Keeps things more modular and organized.

If you're really against saving the content to a file, you can put it in the database and query it when the AJAX call is made.

0


source


Assuming you will be getting the actual user data through another call, you can use two divs. The div containing the html for the user panel starts hiding. When you get a successful login, hide the login div and show the user panel of the panel. Using the data from the AJAX login, fill in the custom panel information. I am guessing that the boolean AJAX call will return the necessary information to fill in the username and what they can do. It just makes it so you don't have to pull in the html for the entire user panel.

0


source


Could you please pass a query string parameter to the page and then based on that render only a partial render (sidebar only) of the page? Then just use your normal jquery / ajax method and include the query string parameter.

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


source






More articles:


All Articles