Link to home
Start Free TrialLog in
Avatar of stevenradams
stevenradams

asked on

Spry data won't load in IE...

I am using DW CS4 to develop my own website (as a graphic designer trying to grow into a web designer).

I've created an rss file which references my blog page... I've got my DW template within which I have my spry repeating region and I have dragged in my spry {title} reference from the bindings tab.

All is well and happy in FF, safari etc etc... but no joy in IE.

When I view my site in IE (www.adamsapplemedia.co.uk), the right hand div displays the code, as well as the small bit of twitter code in the same div after the spry stuff, for a split second and then vanishes. Presumably as the JS is trying to reference my rss file.

I have checked that the PC I am testing in has JS switched on, but this has made no difference. Having read other Q's on here I've also removed line breaks and white space from the code... to stop IE being quirky. But no joy.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:spry="http://ns.adobe.com/spry">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<!-- TemplateBeginEditable name="doctitle" -->
<title>adamsapplemedia.co.uk</title>
<!-- TemplateEndEditable -->
<style type="text/css">
<!--
#container {
	width: 75%;
	min-width: 70%;
	border: 1px solid #333;
	position: relative;
	margin-top: 10px;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
}
#menudiv {
	float: left;
	width: 10%;
	position: relative;
	padding-top: 8px;
	padding-right: 12px;
	padding-bottom: 8px;
	border-right: dotted 1px #F90;
	text-align: right;
	margin-right: 15px;
}
#contentdiv  {
	float: left;
	width: 50%;
	margin-bottom: 15px;
	margin-left: 15px;
}
#containerstretchdiv {
	clear: both;
	text-align: right;
	font-size: 9px;
	padding-right: 3px;
	font-family: Arial, Helvetica, sans-serif;
	color: #F90;
}
#headdiv {
	clear: both;
	background-image: url(../images/aam_header.jpg);
	background-position: left center;
	height: 150px;
	background-repeat: no-repeat;
}
#feeddiv {
	float: right;
	width: 25%;
	position: relative;
	padding-top: 8px;
	padding-bottom: 8px;
	padding-left: 8px;
	border-left: dotted 1px #333;
	padding-right: 10px;
	margin-bottom: 10px;
}
/* following style is for the twitter feed */
#container #feeddiv #twitter_div {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	line-height: 18px;
}
#container #feeddiv #twitter_div #twitter_update_list {
	list-style-type: none;
	text-indent: 0px;
	margin: 0px;
	padding: 0px;
}
-->
</style>
<link href="../css/p a.css" rel="stylesheet" type="text/css" />
<!-- TemplateBeginEditable name="head" -->
<!-- TemplateEndEditable -->
<script src="../SpryAssets/xpath.js" type="text/javascript"></script>
<script src="../SpryAssets/SpryData.js" type="text/javascript"></script>
<script type="text/javascript">
<!--
var stevenadamsblog = new Spry.Data.XMLDataSet("../rss/stevenadamsblog.rss", "rss/channel/item", {distinctOnLoad: true});
//-->
</script>
</head>
<body>
<div id="container">
<div id="headdiv"></div>
<div id="menudiv">
<p><a href="../index.php" title="about adamsapplemedia" target="_self">about</a></p>
<p><a href="../blog.php" title="visit steven adams' blog" target="_self"><strong>blog</strong></a>    </p>
<p><a href="../print.php" title="our print media experience" target="_self">print</a></p>
<p><a href="../web.php" target="_self">web</a></p>
<p><a href="../word.php" target="_self">word</a>    </p>
<p><a href="../contact.php" title="Contact adamsapplemedia" target="_self">contact</a></p>
</div>
<!-- TemplateBeginEditable name="maincontent" -->
<div id="contentdiv">
<p>&nbsp;</p>
</div>
<!-- TemplateEndEditable -->
<div id="feeddiv" spry:detailregion="stevenadamsblog">
<h1>// latest blog posts</h1>
<p spry:repeatchildren="stevenadamsblog">
<a href="../blog.php#{title}" title="...read more..." target="_self">{title}</a>
</p>
<p>&nbsp;</p>     
<div id="twitter_div">
<h1 class="sidebar-title">// follow steven on twitter</h1>
<ul id="twitter_update_list"></ul>
<p>&nbsp;</p>
<p><a href="http://twitter.com/stevenradams" id="twitter-link" style="display:inline;text-align:left;">follow me on twitter</a></p>
</div>
</div>
<div id="containerstretchdiv">copyright steven adams 2009</div>    
</div>
<script type="text/javascript" src="http://twitter.com/javascripts/blogger.js"></script>
<script type="text/javascript" src="http://twitter.com/statuses/user_timeline/stevenradams.json?callback=twitterCallback2&amp;count=2"></script>
</body>
</html>

Open in new window

Avatar of Jason C. Levine
Jason C. Levine
Flag of United States of America image

I see the Spry region just fine in Firefox, which usually indicates a poorly structured feed is throwing off IE or the feed contains one or more chartacters that is screwing IE up.  I do notice that your feed is being served as text/plain as I cannot live bookmark it in either application.  That alone may be screwing it up.
Avatar of stevenradams
stevenradams

ASKER

Hi Jason,

thanks for the fast reply; any reading I've done alone does sit along these lines (i.e. feed type rather than JS on page)... but I'm afraid my knowledge of xml/feeds etc is poor... sorry :)

When you say it's being served as text/plain, what do you mean? Do you mean the .rss file is 'scripted' incorrectly, or do you mean the manner that it's being imported is incorrect?

Thanks for your help.

ASKER CERTIFIED SOLUTION
Avatar of Jason C. Levine
Jason C. Levine
Flag of United States of America image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
you're my hero jason... i've been trying to sort that for blummin ages.

i recreated the feed (as an xml), changed the code in the dwt to reflect that, synced with dw and deleted any old files from the server... and robert's yer father's brother... it worked :)

thank you, brilliant stuff. i'd searched forums'n'everywhere looking for answers to this!
Excellent answer  the issue was (in essence) referencing a .rss file rather than .xml. Not sure why IE needed the change but it worked a treat.

Quick and accurate - thanks.
I've seen this happen a few times before and if the name change fixes it, it's probably because the MIME type is not setup correctly on the feed server.  When I browse to the XML version, I see what I expect to see from a feed (screenshot)

Apparently, Firefox is less twitchy than IE in this matter (unusual) and simply read the text version and decided it was a valid feed.  Usually it's IE that attempts to outthink the code and displays what it perceives is correct even if the code isn't.
snapper1248115868392.jpg
I did a little more than just rename it, though it probably equated to the same thing. Because I create the feed using dreamfeeder extn, which is a quick little processor for gathering my blogs etc, I deleted the old feed and recreated it. The only chance you have to specify the file type is when it asks you to save your settings... if you don't add anything than df tabs on the .rss extn. This time, I added the .xml. So, prob equates to renaming, but I wanted to be sure.

I wonder why the twitter code after the spry stuff didn't render either though, as it was totally unconnected to the issue, but for some reason IE just seemed to flounder on the spry stuff and ignore the rest of the div.

Thanks again.

How did you generate the Twitter code?
I didn't  twitter.com has a little help area where you can grab html/flash/js code to add to your blog/website. I just grabbed that, as the code references some twitter-side stuff that I didn't have details of. The only amendments I made were to style the twitter 'feed' with css.

Twitter code, for interest, is

<div id="twitter_div">
<h1 class="sidebar-title">// follow steven on twitter</h1>
<ul id="twitter_update_list"></ul>
<p>&nbsp;</p>
<p><a href="http://twitter.com/stevenradams" id="twitter-link" style="display:inline;text-align:left;">follow me on twitter</a></p>
</div>

with the following before /body

<script type="text/javascript" src="http://twitter.com/javascripts/blogger.js"></script>
<script type="text/javascript" src="http://twitter.com/statuses/user_timeline/stevenradams.json?callback=twitterCallback2&count=2"></script>



Interesting.  There's more than one way to grab a twitter feed, which is why I even asked.  The Twitter stuff shouldn't care what is going on in the rest of the page...
that's what I thought ... but thankfully it's not an issue anymore :)
Hey Steven,

I'm seeing a bug on my end with email notifications from this thread.  Can I ask you to post another comment here as soon as you see this?
Like this... ?
Thanks.  Bug confirmed and I now have samples to forward.  Thanks again!
:) least I could do!