Question

I have a Generic list in my Model class. I want to have a textbox with autocomplete in my view which fills data from the generic list. How can I do this?.

Answer 1

For this you will need

1. Function on server side which will return list of matching data and will accept string entered by the user.

   Something like this

   public JsonResult AutoComplete(string input)
   {
        //Your code goes here
   }
   

2. In the View, for the text box you need to bind KeyDown event. You can take help of jQuery for this. On key down handler you will make an Ajax call to the function you have defined in the Controller. Some thing like this:

   $.ajax({
     url: '@Url.Action("AutoComplete", "ControllerName")',
     data: 'input=' + sampleInput,
     success: function (data) {
       //Show the UL drop down
     },
     error: function (data) { 
       // Show Error
     }
   });   
   

   In response you will get list of strings, which you will need to bind to some html element like “UI”. Once done, display this UI with proper CSS below the text box. Using jQuery, you can retrieve the pixel location of text box too.

You can not use Asp.Net Auto Complete box in your project as you are developing app in MVC (no viewstate). I hope you get the idea.