Open Voice

Photo of Kyle Rush

Today we are joined by Kyle Rush the developer of the jQuery plugin jParse. jParse is a plugin for jQuery that makes parsing XML returned from an Ajax call dead simple.

Schalk Neethling: Welcome to Open Voice Kyle. To kick things off, please tell us a little more about yourself.

Kyle Rush: Hi Schalk, thank you for having me at Open Voice. I’m very grateful to be given the opportunity to discuss jParse with your readers. As for some quick background information on me, I’m a front-end web developer for Blue State Digital. I work with HTML, CSS, Expression Engine and JavaScript all day. One of my favorite things to do is experiment with JavaScript, especially jQuery. At BSD I’ve most recently had the pleasure of having a role in the development of of the website for the Commission on Smart Global Health for the Center for Strategic and International Studies. For more information on me you can check out my personal site: http://www.kylerush.net

Neethling: Please give us some background information about jParse

Rush: jParse began as a solution to a problem I had while working on a project. The problem was that the environment the project lived in didn’t allow me to parse an XML feed on the server side. So, out of necessity, the beginnings of the jParse code were born. However jParse has become much more than a solution to limitations now. For whatever reason one may need/want to parse XML on the client side, jParse is a quick, easy and customizable way to do so.

Neethling: How is jParse different from other XML parsing utilities, either as standalone JavaScript or as a jQuery plugin?

Rush: As I mentioned above, jParse parses XML on the client side (in the visitor’s browser), so there are lots of differences from jParse and traditional methods to parse XML (PHP, ASP, Python, etc.). While the overall output may be the same between parsing XML on the client side vs. the server side, one big difference is that, when using jParse, the browser is performing all the work, which takes the load off of one’s server(s). Another difference is that because jParse is JavaScript, functions involving the DOM can be run after the page has loaded. This isn’t to say that jParse is a better solution than parsing XML on the server side, but rather that it’s a viable option that may better suit some projects over others. I can certainly think of many situations where parsing XML on the server side is a much a better solution.

Another thing that sets jParse apart is that it’s such a quick and easy solution. If one doesn’t need specifically complex output, then jParse is usually much quicker than writing some JavaScript by hand to accomplish the same task. I always like a good challenge and would in some cases enjoy writing something from scratch, but sometimes the project’s timeline is the biggest priority and so it then makes sense to use jParse.

At the time that I wrote jParse (October ‘09) I wasn’t aware of any other jQuery plugins that parse XML–and still am not–so it’s certainly unique in that manner as a jQuery plugin.

Neethling: Please share some code samples to demonstrate how jParse works.

Rush: I’ve said that jParse makes parsing XML easy, so let me show you just how easy it is to use. Assuming that you’ve already loaded the jQuery library, you can use code sample 1 to parse an XML feed. The first line selects the DOM elements that will contain the output. The second line specifies the URI of the XML. The third line instructs jParse which XML nodes to pull values from. The output is a string that allows you to insert the value of the nodes you’ve selected in certain places of the string. The first node will replace the part of the string which reads ‘jpet0′. The fifth and six lines specify which functions should be run before jParse starts and after it is finished respectively.

$('#ajax-cont').jParse({
    ajaxOpts: {url: 'kyle-rush-feed.xml'},
    elementTag: ['title', 'link', 'description', 'slash:comments', 'comments'],
    output: ' <div class="feed-entry"><h4><a href="jpet1">jpet0</a></h4><p><a href="jpet4">jpet3 Comment(s)</a><p>jpet2</p></p></div>',
    precallback: 'start()',
    callback: 'finish()'
});

Here is another code sample to demonstrate some other jParse options. The second line includes an additional jQuery .ajax method option, ‘timeout’. This sets a delay on the ajax request in milliseconds. So, in this instance the ajax request will be delayed for 5 seconds. The ajaxOpts setting of jParse can accept any of the jQuery .ajax method options, so in this sense it is really adjustable. The third line is still an array, but the array contains some objects. In the first object, you can see that jParse has the ability to exclude items with certain words, characters or numbers in them. So, in this example, jParse will exclude any item whose title has the word ‘dog’ in it. The last object in this array is an example of how to select the value of a node’s attribute. Line 5 instructs jParse to only include five items in the output. Line instructs jParse to output the number of items found in the feed in the specified DOM element.

$('#ajax-cont').jParse({
    ajaxOpts: {url: 'kyle-rush-feed.xml', timeout: 5000, },
    elementTag: [{elem: 'title', exclude: 'dog'}, 'dc:creator', {elem: 'guid', attr: 'isPermaLink'}],
    output: ' <div class="feed-entry"><h4><a href="jpet1">jpet0</a></h4><p><a href="jpet4">jpet3 Comment(s)</a><p>jpet2</p></p></div>',
    limit: 5,
    count: '#count'
});

Neethling: What are the future plans for jParse and in which ways can the community get involved?

Rush: The future of jParse is really unlimited. I have a few new features planned for jParse which include live updating, support for multiple URI’s of XML feeds, an ‘include’ option to match exclude and the option to integrate JavaScript date, which is a JavaScript functions that allows you to format dates the way PHP does–very cool!

I’m very open to new ideas for the plugin. I’m really excited that there has been so much interest in the plugin so far. I’ve already been contacted about improvements for the plugin. One of the ideas, from @macfanatic, is to allow for custom functions to format the output of each XML node. I thought it was an excellent idea and it will definitely make it into the next feature upgrade release of jParse. If anyone would like to contribute code or ideas to jParse, just tweet me: @kylerush. You can also follow me if you want updates on jParse, or subscribe to the jParse blog.

Please add your questions, comments and praise for Kyle below. Looking forward to hearing from everyone and using jParse myself.