AJAX content from an RSS feed using jQuery

Developer
Martin Boyce
Size
3,878 Kb
Views
18,216
  1. AJAX content from an RSS feed using jQuery Previews
  2. AJAX content from an RSS feed using jQuery HTML Codes
  3. AJAX content from an RSS feed using jQuery CSS Codes
  4. AJAX content from an RSS feed using jQuery JS Codes

How do I make an ajax content from an rss feed using jquery?

Grab an RSS feed via Yahoo Query Language (YQL) to get json data and avoid the cross domain problem. parse the data.. What is a ajax content from an rss feed using jquery? How do you make a ajax content from an rss feed using jquery? This script and codes were developed by Martin Boyce on 20 September 2022, Tuesday.

AJAX content from an RSS feed using jQuery Previews
IQ Test

AJAX content from an RSS feed using jQuery - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>AJAX content from an RSS feed using jQuery</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css"> <link rel='stylesheet prefetch' href='http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css'> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div class="container"> <div class="row"> <h2>New Items Lists <small>Sutherland Shire Libraries</small></h2> <h1>RSS to HTML via JSON</h1> <p class="lead">New Items Lists generated from RSS feeds that are fetched through Yahoo Query Language (YQL) to provide a JSON feed</p> <div id="newItemsSelector" class="new-items-selector"> <a id="newAdultFiction" class="loader btn btn-info" href="https://webpac.sutherlandshire.nsw.gov.au/screens/newfiction.html" data-feed="newadultfiction">New Fiction</a> <!-- /newAdultFiction --> <a id="newGraphicNovels" class="loader btn btn-info" href="https://webpac.sutherlandshire.nsw.gov.au/screens/newgraphicnovels.html" data-feed="newgraphicnovels">New Graphic Novels</a> <!-- /newGraphicNovels --> <a id="newDVDs" class="loader btn btn-info" href="https://webpac.sutherlandshire.nsw.gov.au/screens/newdvds.html" data-feed="newdvds">New DVDs</a> <!-- /newDVDs --> </div> <!-- /new-items-selector --> <div class="loading"> <p>Loading Data...</p> </div> <div id="newitemsFail" class="new-items-fail alert alert-block alert-error hide"> <span type="button" class="close" data-dismiss="alert">&times;</span> <h4>Uh-Oh! Something Went Wrong</h4> It looks like we couldn't fetch the data you're looking for. You can reload the page and try again. If that doesn't work, leave a comment below telling us which list you were looking for and we'll investigate. </div> <div id="newItemsData" class="new-items-data"> <h2></h2> <ul id='newItems' class='new-items list-unstyled thumbnail'> </ul> </div> </div> </div>
</div> <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script> <script src="js/index.js"></script>
</body>
</html>

AJAX content from an RSS feed using jQuery - Script Codes CSS Codes

.thumbnail > li { border-bottom: 1px dashed #ccc;
}
.thumbnail > li:last-child { border-bottom: none;
}

AJAX content from an RSS feed using jQuery - Script Codes JS Codes

// var jsonSource = "https://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20rss%20where%20url%3D'http%3A%2F%2Fwebpac.sutherlandshire.nsw.gov.au%2Ffeeds%2Fnewsport.xml'&format=json&diagnostics=true&callback=?";
$(".loader").on("click", function(event) { $(".new-items-data").hide(); $(".new-items-fail").hide(); $(".loading").fadeIn("fast"); //call the function that generates the list populateList($(this).data("feed"), $(this).text(), $(this).attr("href")); //prevent the default action on the link in the btn event.preventDefault();
});
var populateList = function(feedName, feedTitle, extUrl) { var xmlSource = "http%3A%2F%2Fwebpac.sutherlandshire.nsw.gov.au%2Ffeeds%2F" + feedName + ".xml"; var jsonSource = "https://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20rss%20where%20url%3D'http%3A%2F%2Fwebpac.sutherlandshire.nsw.gov.au%2Ffeeds%2F" + feedName + ".xml'&format=json&diagnostics=true&callback=?"; var fallbackURL = extUrl; var newItemsFail = function() { $(".loading").fadeOut("fast"); document.location.href = fallbackURL; }; //fetch the json feed $.getJSON(jsonSource, function() { console.log("json request:" + jsonSource); console.log("success"); }) .done(function(data) { console.log("retrieved JSON data"); $(".loading").hide(); $("#newItemsData > h2").text(feedTitle); $("#newItems").empty(); //if there are items in the data generate an <li> for each if (data.query.results.item.length > 0) { $.each(data.query.results.item, function(i, item) { var $title = item.title; var $webpac = item.link; var $description = item.description; var $bib = $webpac.substring(48,56); var $encore = "https://encore.sutherlandshire.nsw.gov.au/iii/encore/record/C__R" + $bib; var $isbn = item.guid.content.substring(0,13); var $isbn10 = $isbn.substring(3,13); var $isbns = $isbn + "%7C" + $isbn10; if (item.description !== undefined) { $("<li class='media'><div class='media-body'><h4><a href='" + $encore + "' target='_blank'>" + $title + "</a></h4><p>" + $description + "</p></div><div class='media-right media-middle'><img class='media-object' src='https://librariesaustralia.nla.gov.au/search/coverart?isbns=" + $isbns + "&cc=enk&size=medium' /></div></li>").appendTo("#newItems"); } else { $("<li class='media'><div class='media-body'><h4><a href='" + $encore + "' target='_blank'>" + $title + "</a></h4></div><div class='media-right media-middle'><img class='media-object' src='https://librariesaustralia.nla.gov.au/search/coverart?isbns=" + $isbns + "cc=enk&size=medium' /></div></li>").appendTo("#newItems"); } }); } else { // if the json request is successful but there are no items console.log("no data retrieved"); newItemsFail(); } $(".new-items-data").fadeIn("slow"); }) .fail(function() { //if the fetch fails reveal the error alert .new-items-fail console.log("fail"); newItemsFail(); }) .error(function() { //if the fetch fails reveal the error alert .new-items-fail console.log("error"); newItemsFail(); });
};
populateList("newadultfiction", "New Fiction", "!");
AJAX content from an RSS feed using jQuery - Script Codes
AJAX content from an RSS feed using jQuery - Script Codes
Home Page Home
Developer Martin Boyce
Username boycetrus
Uploaded September 20, 2022
Rating 3
Size 3,878 Kb
Views 18,216
Do you need developer help for AJAX content from an RSS feed using jQuery?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Martin Boyce (boycetrus) Script Codes
Name
Fetching book covers with the Google Books API
Get the app
Nested flexbox layout for library catalog
Scratchpad
Booklist Using Google Spreadsheets as JSON Source and Handlebars for templating
First steps with Handlebars.js
Google Maps API test
Test Case for ajax fail on single result
Google Analytics Event Tracking using html5 data attributes
Test Case for ajax fail on single result v2
Create amazing SEO content with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!