Question

With Stack Overflow’s “Ask Question” feature, when I’ve finished typing the title of the question I’m asking, the area beneath the title would open up and display a list of “related questions.”

How do I implement that using jquery/JavaScript? Is there any plugin or open source code I could use for that?

I’m building a site using Django and Solr (for fulltext search). So ideally the solution would work well with those 2 technologies.

Answer 1

The question of how you match the questions had been asked already.

The answer of how you should implement it in AJAX is as follows:

First, implement a web service that you can query using JavaScript, that takes a question title and returns a list of questions that seem related. Let’s say the service is at http://example.com/queryRelatedQuestions, and returns a JSON object in the following form:

{
    "How to find the average speed of an African sparrow": "http://example.com/questions/1",
    "Speed of European sparrows diminishing, help ASAP": "http://example.com/questions/2"
}

Second, when the user has entered the question title (blur event of text input), query the service like this:

$.post('http://example.com/queryRelatedQuestions', {
        query: $('#title-text').val()
    },
    function(data){
        var result = ['<ul>'];
        $.each(data, function(title, url) {
            result.push('<li><a href="');
            result.push(url);
            result.push('">');
            result.push(title);
            result.push('</a></li>');
        });
        result.push('</ul>')
        $('#relatedQuestions').html(result.join(''));
    }
);