treehouse : what would you like to learn today?
Web Design Web Development iOS Development

[Solved] AJAX initial page not loading in IE7

  • I'm having an issue with AJAX and I can't seem to find a straight answer anywhere...

    I'm currently working on several sites based on the same AJAX technique, using the ba-hashchange.js plugin.

    I'm using the index page as an empty shell that once loaded then loads in the home page via AJAX, ie. www.mydomain.com becomes www.mydomain.com/#home/

    Here's a code snippet:

    $(document).ready(function () {
    
        if (window.location.hash == "") {
        window.location.hash = "home/";
      };
    
    });
    

    This technique works perfectly on all browsers I've tested on, with the exception of IE7. In IE7 the index page loads and the URL changes to /#home/, but the content doesn't load in. If I refresh the page, or click on a new page the content loads perfectly. It's just the initial load that's the problem.

    Does anyone have any experience with this or a similar issue?

  • Maybe you need to trigger a hash change event after you change it?

    $(document).ready(function () {
    
        if (window.location.hash == "") {
            window.location.hash = "home/";
            jQuery(window).trigger( 'hashchange' );
        }
    
    });
    
  • Just a slight change, both will work fine

    $(document).on('hashchange',function(){
      if(window.location.hash == "") {
         window.location.hash = "home/"; 
      }  
    }).trigger('hashchange');
    
  • Thanks guys, @Mottie your solution works perfectly, @karlpcrowley your solution looks neat but unfortunately it doesn't work.

    Got this from @ChrisCoyier, might be of interest to you or anyone else who finds this thread:

    http://css-tricks.com/rethinking-dynamic-page-replacing-content/

  • Ha silly me, it should start with $(window) not $(document)