MagpieRSS, Ajax And Behaviour: Oh My!

20 Jul

Last month I posted and documented an interesting way of using a combination of MagpieRSS and AJAX technology to serve up remote RSS feeds to your own site. Since then I’ve come across a few posts from others expressing concern about accessibility and DOM related scripting and wanted to redefine the code somewhat to make the markup a lot cleaner and more accessible.

Enter Behaviour from Ben Nolan which I came across whilst searching for ways to make AJAX markup cleaner.

The Problem

In my previous example I had this:

Dredge

Which is not very accessible at all. As Ben himself says:

After all the work of WASP and others to promote clean markup, valid pages and graceful degradation via CSS – it sucks that we’re going back to tag soup days by throwing Javascript tags into our HTML.

So he wrote an excellent piece of Javascript which he called Behaviour. Using it we can get from the above piece of code to this:

Dredge

Which is much much better and a lot more readable.

The Solution

The answer is Ben’s Behaviour. It basically allows you to use CSS selectors to specify elements to add Javascript events to. For example:

So here we use an event thats specifically set to be triggered when the ‘andy’ class of an ‘a’ element is used. How easy is that? And it makes our markup so much cleaner and more accessible.

However…

There’s always a ‘but’ or a ‘however’ right? Well, yeah there is here too. There’s no easy way to have multiple dynamic sources so what you need to do is set each new object manually in your Javascript like so:

Which is triggered by your links like so:

Now thats a bit of a ball-ache but the accessibility and semantic advantages are massive. Besides it is possible to seriously redefine the Javascript used – maybe place all feed URL’s in an array and call array elements into the object dynamically – you could even get your server side code to add to the array dynamically i.e. get PHP (or perl/Python/ASP/whatever) to open up the .js file and write to the array – it all depends on how much automation you want. For me, the prime concern was cleaning up the markup to make it more accessible – going the long way round on the behaviour side is a small price to pay. So far.

Here’s the revamped page.

Ammended!

OK, as per comment no.1 this is now form-less. The code adjustments are as follows – first we adjust our javascript Behaviour object to:

Next we alter our core AJAX script like so:

Lastly, you can remove the now obselete element from the markup – job done.

One Response to “MagpieRSS, Ajax And Behaviour: Oh My!”

  1. Kev July 20, 2005 at 11:07 #

    I’ve also just realised I can dispense with the form element. D’oh!

Comments are closed.

%d bloggers like this: