Ajax back button jquery - Need full example step by step.

Question

Hi. I need help supporting back button with jquery ajax.load method.

I have tried a couple of plugins but i cant get any of them to work.

I am loading my content like this:

 $('.pagination a').click(function(){        
            var url = $(this).attr('href');
            ajaxLoad(url,null,'.container');   
            return false;
        });

Note: ajaxLoad function executes the jquery load method.

Many thanks for your help.

Answer 1

for back button in ajax you can save page status by Anchor where in each load you change the url anchor (as called page bookmarks) Eg:

www.yoursite.com/page.aspx
//Load Article number 1
www.yoursite.com/page.aspx#art1
//Load Article number 2
www.yoursite.com/page.aspx#art2

you can change it using window.location

you will notice this in Gmail when you look at url read more about anchors with ajax

Answer 2

OK i have set my urls like this: href="news.php?page=2#p2

I could add directly ?#page=2 but that would break the links if the user has javascript disabled.

 $('.pagination a').click(function(){
            var hash = window.location.hash;
            var pagetoLoad= window.location.hash.substring(1));

             ...
        });

but now how do i update my url with the new page value?

Note that my urls are auto-generated by php and i am using Symfony Framework functions to generate then like this: href="page=1">First

I could call the php function from javascript but some of my links have really big querystrings with lots of php inside. That wouldn´t look very good.

I dont know if there is a best way.I want something that can be reusable without many problems.