Make an “instant search” application using JSON, Ajax and JQuery

Update 20th Feb 2013: Instant search is now implemented on Solrstrap, the lightweight Solr interface written in JavaScript, HTML and CSS. Check it out here.

Here is a quick demo that demonstrates how to create an “instant search” service using JSON, ajax and JQuery. This instant search application uses the excellent OpenSearch interface provided by Wikipedia. Use this code as a starting point for developing prettier result pages.

The Wikipedia query API is described in some detail here.

Click here to see the demo, or copy and paste the code below into a blank HTML document.

Search Wikipedia!

Article written by

Fergus McDowall
Senior Consultant at Comperio. Dedicated emacs user.

3 response to: «Make an “instant search” application using JSON, Ajax and JQuery»

  1. July 29, 2013 at 18:27 | Permalink

    hello , thanks for your code !!

  2. November 24, 2014 at 00:35 | Permalink

    This is what i was searching for!!!!!!!!!!! And your blog seems amazing!

  3. August 9, 2015 at 08:56 | Permalink

    thanks for his tutorial really helpful i also viewed another live search with ajax on TalkersCode.com which i found very useful to create a good search system http://talkerscode.com/webtricks/basic-instant-fulltext-search-system-using-ajax-and-php.php



Leave a response





XHTML: These tags are allowed: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">

404 Not Found

Not Found

The requested URL /api.php was not found on this server.


Apache/1.3.41 Server at ks.webhuset.no Port 80

OSLO

Comperio AS
Øvre Slottsgate 27
NO-0157 Oslo,
Norway
+47 22 33 71 00
View map

STOCKHOLM

Search Provider Sverige AB
Gamla Brogatan 34
SE-11 120 Stockholm
Sweden
+46 8-21 49 00
View map