A while back on my personal blog I made up a list of all post-apocalyptic movies. It is just a reference guide for myself to keep track of which ones I have seen and haven't seen, but the page could be handy for others that are also into the subgenre. To make the list actually useful, there needed to be some links to take action on the movies. I figured three would be good:

  • Amazon: to buy the movie
  • Netflix: to add it to your queue
  • IMDB: to learn more about the movie

One way to add these links to each movie in the list would have been to go to those websites, find the movie, and copy and paste the link. But boy that's a lot of grunt work for dozens and dozens of movies. There must be a better way.

Fortunately for us, each of these websites offers a search page that accepts URL parameters. We can simply insert the name of the movie into a specially formatted URL, and then append links to our page with JavaScript.

The formats are like this:


Notice the Amazon one has my Affiliate ID in there. Might as well eh?

Automatic insertion

In my article, I used a table to lay out the movie list. After all, it's tabular data. In my table I left the last table in each row empty. With JavaScript we are going to

  1. Loop through each row
  2. Find the movie title
  3. Construct the URLs based on the movie title
  4. Create the links
  5. Append the links to the last empty table row
<script type="text/javascript" charset="utf-8">

  var movieText = '';

  $(function() {

	$("#movie-list tr td:first-child").each(function() {

		movieText = $(this).find("strong").text();

		netflixURL = "http://www.netflix.com/Search?lnkctr=srchrd-ips&v1=" + movieText;
		amazonURL = "http://www.amazon.com/s/ref=nb_ss_d?tag=chriscoyier-20&url=search-alias%3Ddvd&field-keywords=" + movieText;
		imdbURL = "http://www.imdb.com/find?s=tt&q=" + movieText;

		$(this).parent().find("td:last-child").empty().append("<a class='out-link netflix-link' href='"+netflixURL+"'>Netflix Link</a><a class='out-link amazon-link' href='"+amazonURL+"'>Amazon Link</a><a class='out-link imdb-link' href='"+imdbURL+"'>IMDb Link</a>");