Append DOM to Another Page Using YQL

Apparently there is a data limit to how much we can fit into a content field on our CMS at work. The problem was that there is an incredibly long list of donors names, and when saving the edits to a page in the CMS, it just wouldn’t save past a certain point in the list.

So, I was a bit stumped on how best to workaround. So, I created another page with a good amount of the names in an unordered list. I then used YQL to create a REST query that would output only the HTML on the page that I wanted into and XML feed.

select * from html where url="" and xpath='//*[@id="main"]/ul/li'

I’m not too sharp on my xpath selectors, but luckily it’s very easy to find an xpath using Chrome. Just right click on an element in the inspector, and the option is there. Huge timesaver!

Ok, now I had a REST query courtesy of YQL of the HTML elements that I wanted to take from that page.

Next was to load and append the data from the REST query onto the unordered list on the other page.

        type: "GET",
        url: "*'%2F%2F*%5B%40id%3D%22main%22%5D%2Ful%2Fli'&diagnostics=true",
        dataType: "text",
        cache: false,
        success: function(xml)
            $(xml).find('li').each(function() { 
    			$("#main ul.append-list").append($(this));

Using the jQuery library I was able to load view the ajax function the REST query. I had to choose the dataType of text not xml in this case. That way I was simply appending the results as they were in the REST query.

I can clean up the javascript a bit, and will work on that. However for now, I am able to add data from another page to work around the data limits of the CMS.


YQL Query Builder

YQLOne of my favorite web services, YQL is now even easier to use. They’ve recently added a Query Builder to the YQL console, so now it’s so much easier to figure out which keys are available in tables.

Previously I found I had to dig deep into an XML file, and use a lot of trial and error to figure out what keys were available, but he Query Builder now handles the majority of that for me. It also exposes the metadata in a friendly visual format, which is another great thing too.

Sub-queries aren’t supported yet, but hopefully that’s something that they might be able to add in the not too distant future.

All the details are mentioned on their blog with a nice screencast going over how to use it.

All in all a very impressive improvement to an already great service.


YQL is my new BFF


YQL, Yahoo’s SQL-like language that provides straightforward ways to mash up different APIs into one data source for use in applications has been around for a few months now. In that time I’ve found it to be extremely useful and easy to work with in numerous projects. However,  the service got 10 ninjas better last week they added the ability to insert, update and delete to the service as well.

In just a few minutes I was able to take an existing news app that I had created in the past and using the YQL service had it sending out tweets to Twitter as well as including a shortened URL courtesy of the API.

Just feed the following Twitter status update to the YQL Console and it’ll create the REST query that you can use in your script:

use '';
insert into twitter.status (status,username,password)
values ("Playing with INSERT UPDATE and DELETE in YQL", "twitterusername","twitterpassword")

Yahoo! Term Extraction Web Service

Just finished up using one of my favorite and what seems to be little well known web service, the Term Extraction from the folks a Yahoo! You feed it some content and it returns a list of significant words from the content. This simple service can be incredibly useful.

For instance I recently used this service to scan an article on a site and using the words that it returns, as tags to pull relevant photos from Flickr to go along with the article. So in this case I used it to pull tags from a body of text, very cool. You can also use YQL to make calls to it as well.


YUI Treeview

The sitemap for has grown quite a bit over the years, and we were looking for a way to make it more manageable while still being accessible. The YUI Treeview version 2.6.0 supports progressive enhancement, focus and keyboard navigation. Which seemed a perfect fit for what was needed.

Implementing it couldn’t of been any easier too. Just include the necessary source files. Then just create and render the Treeview.

tree1 = new YAHOO.widget.TreeView("markup");

Astra Carousel

The fine folks at the Yahoo! Developer Network released an Astra Carousel component just recently. From what I’ve messed around with it thus far it seems pretty impressive and fairly easy to modify. It’s based on the built in List component, so populating it is easy.

They’ve got some great documentation on it and some examples to get started.  Based on what I’ve seen thus far, I think that it’ll work it’s way into a few of my upcoming projects.