SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    SitePoint Addict beebs93's Avatar
    Join Date
    Jul 2010
    Location
    Vancouver, Canada
    Posts
    207
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    IE + Safari jQuery .load() problem

    I am using the jQuery .load() command to place the output of an PHP script (to load the latest tweets from my account via a JSON call) in a particular <div> (.twitter).

    The scripts work fine in FF, Opera and Chrome, but IE6,7,8 and Safari don't show anything at all.

    Here's the main.js file in question:
    Code JavaScript:
    var Tweets = {
    	init:function(){
    		$('.twitter').load('/api/twitter/twitter.php', function(){
    			$('.twitter').show('slow');
    		});
    	}
    };


    Here are the <script> commands (only ones) at the bottom of the page (before </body>):
    Code HTML4Strict:
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
    <script type="text/javascript" src="/js/main.js"></script>
    <script type="text/javascript">$(document).ready(function(){Tweets.init();});</script>
    <script src='http://www.google-analytics.com/urchin.js' type='text/javascript'></script>
    <script type='text/javascript'>_uacct = 'XX-1234567-8';urchinTracker();</script>

    The twitter.php file:
    Code PHP:
    <?php
    // Set API parameters + initalize array
    $strUser = 'myAccount';
    $strFormat = 'json';
    $intLimit = 4;
    $strCssClass = 'tweet';
    $arrTweets = array();
     
    // JSON API call
    $strTweetsBody = (string) @file_get_contents("http://api.twitter.com/1/statuses/user_timeline/{$strUser}.{$strFormat}");
    if(is_string($strTweetsBody) && $strTweetsBody){
    	$arrTweets = @json_decode($strTweetsBody);
    }
     
    // If successful api call
    if(is_array($arrTweets) || count($arrTweets) > 0){
    	// Display title
    ?>
    	<p>UPDATES <span class="twitterLink">(from <a href="http://www.twitter.com/myAccount" title="Follow me on Twitter" target="_blank" class="link-white">Twitter</a>)</span></p>
    <?php
    	// Display $intLimit value most recent tweets
    	for($i = 0; $i < $intLimit; $i++){
    		// If tweet contains text and timestamp
    		if ($arrTweets[$i] instanceof stdClass && $arrTweets[$i]->text && $arrTweets[$i]->created_at) {
    			//Format text and timestamp
    			$strTweet = htmlentities($arrTweets[$i]->text, ENT_QUOTES);
    			$strTweetTime = htmlentities($arrTweets[$i]->created_at, ENT_QUOTES);
    			$strTweetTime = strtoupper(date("F jS, g:iA",strtotime($strTweetTime)));
    			// Wrap http:// text, @names and #hashmarks in HTML link tags
    			$strTweet = preg_replace('/http:\/\/([a-z0-9_\.\-\+\&\!\#\~\/\,]+)/i', '<a href="http://$1" title="http://$1" target="_blank">http://$1</a>', $strTweet);
    			$strTweet = preg_replace('/(^|\s)@(\w+)/', '\1@<a href="http://www.twitter.com/\2" title="Go to \2\'s Twitter profile" target="_blank">\2</a>', $strTweet);
    			$strTweet = preg_replace('/(^|\s)#(\w+)/', '\1#<a href="http://search.twitter.com/search?q=%23\2" title="Search \'#\2\' on Twitter" target="_blank">\2</a>', $strTweet);
    ?>
    			<div class="<?php echo $strCssClass; ?>">
    				<div>
    					<?php echo $strTweet; ?>
    				</div>
    				<p class="tweetTime"><?php echo $strTweetTime; ?></p>
    			</div>
    <?php    
    		}
    	}
    }
    ?>

    HTML/CSS (shown inline for the example):
    Code HTML4Strict:
    .
    .
    .
    <div class='twitter' style="display:none;">
    <!-- .twitter --></div>
    .
    .
    .

    Sorry that I cannot just link to the site, but it's password-protected as it's a work-in-progress for a client. If there's any other info you need just ask.

    Thanks
    "To be truly dedicated to something
    you must be willing to betray it.
    " -SW

  2. #2
    SitePoint Wizard bronze trophy chris.upjohn's Avatar
    Join Date
    Apr 2010
    Location
    Melbourne, AU
    Posts
    2,191
    Mentioned
    17 Post(s)
    Tagged
    1 Thread(s)
    One thing that has popped up in front of me is Ajax caching, try the following before your .load() and see if it helps

    Code JavaScript:
    $.ajaxSetup({
        cache: false
    });

  3. #3
    SitePoint Addict beebs93's Avatar
    Join Date
    Jul 2010
    Location
    Vancouver, Canada
    Posts
    207
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Tried, but no go. Thanks for the suggestion, though

    IE's error icon in the bottom-left-corner, when dbl-clicked, says that 'Tweets' is undefined.

    It's almost as if Safari and IE are skipping the line <script> line about the Tweets.init();

    I'll try tinkering a bit, but I'm guessing at this point...
    "To be truly dedicated to something
    you must be willing to betray it.
    " -SW

  4. #4
    SitePoint Wizard bronze trophy chris.upjohn's Avatar
    Join Date
    Apr 2010
    Location
    Melbourne, AU
    Posts
    2,191
    Mentioned
    17 Post(s)
    Tagged
    1 Thread(s)
    In your main.js file if you add a new method such as

    Code JavaScript:
    var Tweets = {
        test: 'hello'
    };
     
    alert(Tweets.test);

    does it alert anything?

  5. #5
    SitePoint Addict beebs93's Avatar
    Join Date
    Jul 2010
    Location
    Vancouver, Canada
    Posts
    207
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by SgtLegend View Post
    In your main.js file if you add a new method such as

    Code JavaScript:
    var Tweets = {
        test: 'hello'
    };
     
    alert(Tweets.test);

    does it alert anything?
    Nah, not in IE or Safari.

    I just put the whole thing inline...
    Code JavaScript:
    <script type="text/javascript">$('.twitter').load('/api/twitter/twitter.php', function(){$('.twitter').show('slow');});</script>
    ...and it finally worked. Not sure why, though. I bet I am simply missing some basic principle that is fuggin' up everything. Trick is now to find it...

    Thanks for the help
    "To be truly dedicated to something
    you must be willing to betray it.
    " -SW

  6. #6
    SitePoint Guru whisher's Avatar
    Join Date
    May 2006
    Location
    Kakiland
    Posts
    732
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

  7. #7
    SitePoint Wizard bronze trophy chris.upjohn's Avatar
    Join Date
    Apr 2010
    Location
    Melbourne, AU
    Posts
    2,191
    Mentioned
    17 Post(s)
    Tagged
    1 Thread(s)
    Its as almost as if Safari and IE are ignoring the src file due to the / in the file path


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •