Skip to main content

AJAXify site



I have legitimate reasons to do what I am trying to explain. I have an existing site say abc.com which has regular pages etc. everything written in php. Now I would like to AJAXify the site i.e. when a user clicks on a link, it should fetch the link using AJAX and replace the page contents. This is the easy part and I can achieve it using jQuery get function.





Now the problem comes when the user bookmarks the page. I can use hash tags to specify if the user is on another page, but instead of using javascript to fetch the new page again, is it possible to fetch it directly using PHP when the page is called.





Can you please give me an outline on how to achieve the above. This functionality is similar to what Facebook has.





Thankyou for your time.



Source: Tips4all

Comments

  1. It's a fairly simply process of (1) Parsing the hash tag, and (2) Loading the content via Ajax as you normally would.

    If you load more content when the user clicks on the page, just be sure to always correctly modify the hash tag to reflect what's on the page.

    Here's a quick example to play around with. Click on a name and note the hash tag. The relevant Javascript looks like this :

    // Go straight to content if it's in the hash.
    $(document).ready(function(){
    load_story_from_hash();
    });

    // Call this function whenever user clicks on a hash link
    function set_hash(hash){
    window.location.hash = hash;
    load_story_from_hash()
    }

    // Actually load content based on the hash in the URL
    function load_story_from_hash(){

    var hash = window.location.hash;
    hash = hash.replace(/^#/, '');

    if (hash) {

    $('#post_container').load(hash+'.html', {}, function(){
    $.scrollTo('#post_container', 1000);
    });

    }

    }

    ReplyDelete
  2. The answer is no, you can't get the value of the URL hash server side. See How to get Url Hash (#) from server side.

    You'll have to get the hash value client-side and make an extra request.

    ReplyDelete
  3. Well you can use one of these tools or roll your own. Uses window.location.hash along with other tricks.


    YUI - Browser History Manager
    Really Simple History (RSH)

    ReplyDelete
  4. The best way to do this is to have one index.php that loads all other pages based on the URL parts after it. For instance:

    http://www.example.com/index.php/reports/employees/hoursWorked

    In this case index.php will run, it can see what's being requested is is the hours worked report, and load that content. The problem is, if index.php then loads all other content after that using AJAX, the URL in the browser will never change.

    One way around that problem would be to put a "Link to this page" link on every page that contains that form of URL for users to bookmark.

    ReplyDelete

Post a Comment

Popular posts from this blog

Why is this Javascript much *slower* than its jQuery equivalent?

I have a HTML list of about 500 items and a "filter" box above it. I started by using jQuery to filter the list when I typed a letter (timing code added later): $('#filter').keyup( function() { var jqStart = (new Date).getTime(); var search = $(this).val().toLowerCase(); var $list = $('ul.ablist > li'); $list.each( function() { if ( $(this).text().toLowerCase().indexOf(search) === -1 ) $(this).hide(); else $(this).show(); } ); console.log('Time: ' + ((new Date).getTime() - jqStart)); } ); However, there was a couple of seconds delay after typing each letter (particularly the first letter). So I thought it may be slightly quicker if I used plain Javascript (I read recently that jQuery's each function is particularly slow). Here's my JS equivalent: document.getElementById('filter').addEventListener( 'keyup', function () { var jsStart = (new Date).getTime()...

Is it possible to have IF statement in an Echo statement in PHP

Thanks in advance. I did look at the other questions/answers that were similar and didn't find exactly what I was looking for. I'm trying to do this, am I on the right path? echo " <div id='tabs-".$match."'> <textarea id='".$match."' name='".$match."'>". if ($COLUMN_NAME === $match) { echo $FIELD_WITH_COLUMN_NAME; } else { } ."</textarea> <script type='text/javascript'> CKEDITOR.replace( '".$match."' ); </script> </div>"; I am getting the following error message in the browser: Parse error: syntax error, unexpected T_IF Please let me know if this is the right way to go about nesting an IF statement inside an echo. Thank you.