Autocomplete Search using Wikipedia API and jQuery UI

Last modified on by Karthikeyan K

After a long time I’m writing this tutorial for my readers. People have asked me How to implement autocomplete search using Wikipedia Opensearch API.

What is Autocomplete Search?

It is nothing but normal search box where it provides suggestions in a dropdown while typing the keyword in the text box.

By using Wikipedia Opensearch API and jQuery Autocomplete UI, we can easily implement this feature without writing large lines of code.

Implementing Autocomplete Search using Wikipedia OpenSearch API

You need to include both jquery & jQuery UI script in the bottom of your page. I have used google’s jQuery CDN

jQuery & jQuery UI Plugin Code

<script src=""></script>
<link rel="stylesheet" href="" />
<script src=""></script>

Code for Autocomplete Search From Wikipedia

Please replace the ID or Classname of the search box in the below code

source: function(request, response) {
url: "",
dataType: "jsonp",
data: {
'action': "opensearch",
'format': "json",
'search': request.term
success: function(data) {

The above code will send request to Wikipedia & it returns the suggestions based on the keyword via response in JSON format.

For more parameters please visit this url –

View Live Demo  Download

It is very simple to implement in your existing project. I hope you like this tutorial very much.

Please share your feedback via comments & subscribe to my blog to get the latest update on Web technologies.


You May Also Like

2 Responses

  1. Arun says:

    Nice Article sir, Keep Going on… I am really impressed by read this. Thanks for sharing with us

  2. fabien lenoir says:

    hi, i have a question on your code.

    where comes the method “term” applied on your “request” ?


Leave a Reply

Your email address will not be published. Required fields are marked *