How to get Auto-completion in ASP.NET MVC?

Question

Hello,

In ASP.NET MVC, we don't have controls which can do stuffs such as autocompletion (we don't have controls at all from Visual Studio like in web forms).

But, Is it possible to still get 'Auto-completion' with a text box in ASP.NET MVC (like with the textbox found on the Google's Home page)?

If this is the case, what's the best way to do so? JQueryUI? or there's someother way of getting that functionality?

Thanks for helping.

Answer 1

You mean like the one in the jquery ui?

http://jqueryui.com/demos/autocomplete/

Answer 2

To use JQuery Autocomplete with ASP.NET MVC you can do the following:

Step 1 : Create the textbox

<%= Html.TextBox("searchBox",null,new { @class="large", autocomplete="on"}) %>

Step 2 : Create action to do search function (I am using NHibernate to query DB, but the key is to return an string with each result delimited by a newline)

public ActionResult Autocomplete(string q) {

  var programs = programRepository
                   .Search(q)
                   .ToList()
                   .ConvertAll(x => x.ProgramName)
                   .ToArray();

  return new ContentResult {Content = string.Join("\n", programs) };
}

Step 3: turn on autocomplete functionality in your HTML (place inside a script block)

$(document).ready(function() {

  $('#searchBox').autocomplete("/Controller/Autocomplete", { autoFill: true, minChars: 2 });

});