Consuming and Parsing Yelp API Requests Using jQuery

I've been hard at work designing a business directory for our
neighborhood association, Newbold Neighbors, and
I was enamored with the idea of not having to reinvent the
wheel in terms of creating a review system. Why do
the hard work when Yelp has
already done it?

I just bought another hosting plan with PowerDNN so I can begin my
(slow) migration over to DotNetNuke 5. I haven't
even gotten as far as moving my own site over, but I knew that I
wanted to use some of the new features for the neighborhood site
(or at least I wanted new people using it to gain the advantage of
never knowing some of the hang-ups/eccentricities of DNN4…)
Moving the skins and containers over was a cinch-just update the
file references in the headers. So far, so good.

I had purchased a copy of DNNDev's XMod a while back, and
never really found a use for it. I checked around SnowCovered and saw that for
previous owners, the upgrade to XMod 5.5 was just $20! What a
deal-especially since it's the first version to support DNN5.
After reviewing XMod's functionality, I decided that it was
definitely the right tool for the job. Since I heart clean
urls, I also went with the XMod Details View (free) which lets me
show a detail view using the record id. The only downside
(actually, my biggest complaint with DNN) is the lack of
slugability (I can't do /business/details/marinos-auto-repair, but
I can do /business/details/id/5).

I used their tools to create a simple database of company names,
phone numbers, addresses, photos, etc, and then got the layout
working.

So, here's where the magic happens. I use jQuery to get the phone number from
the .phone in each .business
element and pass it off to the Yelp query. Using the
callback=? is required for jQuery to perform a
cross-domain JSON query. jQuery replaces the ? with a custom
identifier transparently.

I have three different views - small, regular, and
details. I want basic data displayed on the small, a bit more
for regular, and some custom stuff for the details (adding in
trends, individual reviews, etc).

I am pretty pleased with how it came out. If you want to
take a look, it can be found over at www.NewboldNeighbors.org/Businesses.
As someone who fancies himself a .Net programmer, jQuery has made
the transition back to client-side processing fun again. Hope
this saves someone a few hours of coding. Enjoy!

This entry was written by Andrew,
posted on Thursday, January 14, 2010
Bookmark the permalink.