Question

I’m building a comics site, and would like to allow users to search for comics stored on the file system. The search will dynamically return thumbnails of each matched comic, which will be linked to the actual full size comic.

I followed this to implement search using XMLHttpRequest:
http://www.w3schools.com/php/php_ajax_php.asp

In that example, it builds a string of values in an array each time there is a letter match.
Instead of a string, I’d like to display an image each time a letter matches.

So, if my comics are: [comic1, comic2, comic3, thiscomic1, thiscomic2]
And I type in “c”, I’d like the images for comic1, comic2 and comic3 displayed.

Can I build a “string” of image file locations so that they can be displayed, comma separated?

Thanks!

Answer 1

You should check out jQuery (http://jquery.com/) – it saves a lot of hte hassles you’re going to encounter with two points.

1. It simplifies the AJAX (XMLHttpRequest can be handled differently with different borwsers, plus there’s all the error checking and state handlign to worry about – jQuery simplifies this)

2. It also simplifies inserting HTML into the DOM (Donig it manually can be a bother, depending on the HTML being inserted).

Basically, use jquery.get() (http://docs.jquery.com/Get#.24.get.28.29_-_Data_transfer_method) and html() (http://docs.jquery.com/Html)

If your return is HTML, then the end code is as simple as

$.get("url",
  {},
  function(returned_data)
      {
      $('#ContainingDiv').html(returned_data);
      });

You should also add in error handling (it can be as small as another 1 line, but you choose when you read the docs) and if you want ot return an “array” of files, you can return JSON (or XML, but JSON is often easier to handle) but you need to write a function to receive and process that list.