ASP.Net MVC Jquery Autocomplete - list not showing

Question

I have implemented an autocomplete in my app for retrive a list of users, but the list is not displaying when I search a user.

In my _Layout.cshtml:

<link href="@Url.Content("~/Content/themes/base/jquery.ui.all.css")" rel="stylesheet" type="text/css" />
<script src="~/Scripts/jquery-2.0.3.js" type="text/javascript"></script>
<script src="~/Scripts/jquery-ui-1.10.3.js" type="text/javascript"></script>

In my View:

<script type="text/javascript">
   $(document).ready(function () {
      $(function () {
           $('#txtListUsers').autocomplete({
               source: '@Url.Action("GetJsonUsers","GestioneLega")',
               minLength: 2
           });
       });
   })
</script>
...
<input type="text" id="txtListUsers" />

My Action:

public JsonResult GetJsonUsers(string term)
{
    var users = GestServices.GetUsersForAutocomplete(term);
    return Json(users, JsonRequestBehavior.AllowGet);
}

Get data:

public static object GetUsersForAutocomplete(string searchTerm)
{
    object users = null;

    using (var db = new FriendsContext())
    {
        users = from cust in db.Users.Where(c => c.UserName.StartsWith(searchTerm))
                        select cust.UserName;
    }
    return users;
}

The function GetJsonUsers not works: doing more tests, I noticed that in GetUsersForAutocomplete function, the variable "users" is filled only in the using scope. if I do an immediate control on users out of using scope, obtain: The operation cannot be completed because the DbContext has been disposed

I solved this problem by following this discussion The operation cannot be completed because the DbContext has been disposed error

score 0 · Answer 1 · answered Sep 07 '13 at 22:38

0

You can set breakpoints on GetJsonUsers and trace through to an error. You can also see what is coming back to your browser using f12.

answered Sep 07 '13 at 22:38

Ross Bush

14,648
2
32
55

The function GetJsonUsers works. In my browser (with f12) I don't see new elements / tags – Tommaso Sep 08 '13 at 07:18

Jatin patil · Answer 2 · 2013-09-08T07:49:16.257

0

Do as follows:

       $('#txtListUsers').autocomplete({
          source:function( request, response ) {
              $.ajax({
              url: "@Url.Action("YourActionName","YourControllerName")",
              dataType: "json",
              data: {},
              success: function( data ) {
                 response( $.map( data, function( item ) {
                    return {
                       label: item.name,
                       value: item.name
                           }
                         }));
              }
             });
             },
           minLength: 2
       });

edited Sep 08 '13 at 07:49

answered Sep 08 '13 at 05:45

Jatin patil

4,252
1
18
27

have u debugged and seen what is the data your receiving in success call of ajax? – Jatin patil Sep 08 '13 at 07:18
I have updated my answer. watch for url now. and set brealpoint on action and whether its getting hit or not. – Jatin patil Sep 08 '13 at 07:37
Yes, the action is call and return the object. – Tommaso Sep 08 '13 at 07:41
Ok then whats the problem now? – Jatin patil Sep 08 '13 at 07:42
I tried to use firebug for dubug javascript code, "data" seems to be empty. I don't see the list of elements for autocomplete – Tommaso Sep 08 '13 at 07:44
Ok. Try Changing your datatype from `jsonp` to `json` – Jatin patil Sep 08 '13 at 07:49
Have a look at my approved answer: http://stackoverflow.com/questions/18402951/asp-net-mvc4-jquery-autocomplete-not-working/18515744#18515744 – Jatin patil Sep 10 '13 at 17:32

ASP.Net MVC Jquery Autocomplete - list not showing

2 Answers2