Response title
This is preview!
Dynamic listview
in jQuery Mobile
•
10 years ago
Hi,
I have this code which is working quite well. The listview is styling up properly 'ALL EXCEPT' the first item in the list. Is their any reason for this? When i inspect the item in chrome, it is telling me that no classes has been added to the list item, so I know this is the problem but have no idea how to fix it.
How can i force the styling on this item. I have tried moving the entire code block on the page but nothing is working.
Any help is greatly appreciated:
<!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">
<head>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.css" />
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"></script>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("feeds", "1");
function initialize() {
var feed = new google.feeds.Feed("http://www.vetsonline.com/annonces/rss.php?idp=18&id_rss=103&site=14&page=accueil&c_texte=&c_secteur=&c_type_transac=&c_type=&template=rssv2.xml");
feed.setResultFormat(google.feeds.Feed.JSON_FORMAT);
//feed.includeHistoricalEntries();
feed.setNumEntries(100);
feed.load(function(result) {
if (!result.error) {
var output = '<ul data-role="listview" data-filter="true"';
var container = document.getElementById("feed");
for (var i = 0; i < result.feed.entries.length; i++) {
var entry = result.feed.entries[i];
output+= '<li>';
output += '<a href= "'+ entry.link +'" >';
output+= '<h1>' + entry.title + '</h1>';
output+= '<p>' + entry.contentSnippet + '</p>';
output+= '</a>';
output+= '</li>';
}
output+= '</ul>';
$('#jobsFeed').html(output);
$('#jobsFeed').trigger( 'create' );
}
});
}
google.setOnLoadCallback(initialize);
</script>
</head>
<body>
<div data-role="page" id="jobs">
<div data-role="header">
<h1>Header</h1>
</div>
<div data-role="content" id="jobsFeed">
</div>
<div data-role="footer">
<h4>Footer</h4>
</div>
</div>
</body>
</html>
1