2016-03-21 13 views
1

Ich versuche, eine Autocomplete-Funktionalität für meine Seite zu machen. Ich habe eine Textbox und möchte Vorschläge aus meiner Datenbank machen.Autocomplete ASP.NET MVC mit JSON

Ich habe diese JsonResult in meinem Controller:

public JsonResult ItemAutocomplete(string term) 
{ 
    var result = _db.SelectTable("SELECT [i].[Name] from [dbo].[Item][i] WHERE [i].[Name] LIKE @0", SqlDb.Params(term +"%")); 
    return Json(result, JsonRequestBehavior.AllowGet); 
} 

und meiner Ansicht nach:

@Scripts.Render("~/bundles/jqueryui") 
<h2>jQuery AutoComplete</h2> 
<script> 
     $(function() { 
      $('#tags').autocomplete({ 
       source: function (request, response) { 
        $.ajax({ 
         url: '@Url.Action("ItemAutocomplete")', 
         extraParams: { term: $('#tags').val(), 
         dataType: "json", 
         contentType: 'application/json, charset=utf-8', 
         data: { 
          term: $("#tags").val() 
         }, 
         success: function (data) { 

          response($.map(data, function (item) { 
           return { 
            label: item 
           }; 
          })); 
         }, 
         error: function (xhr, status, error) { 
          alert(error); 
         } 
        }); 
       }, 
       minLength: 2 
      }); 
     }); 

</script> 

<div class="ui-widget"> 
    <label for="tags">Tags: </label> 
    <input id="tags" /> 
</div> 

Das Problem ist, dass mein ItemAutocomplete JsonResult immer ein Null-param erhält ... auch wenn ich rufe es direkt von localhost, wie folgt: "localhost/Appointment/ItemAutocomplete/item1".

+0

Ich habe versucht, es tut das gleiche .. Ich bekomme auch diesen Fehler: Eine zirkuläre Referenz wurde beim Serialisieren eines Objekts vom Typ 'System.Reflection.RuntimeModule' erkannt. –

+0

Ich zweifle in SQL-Abfrage. Hast du einen Breakpoint in Code-Behind gesetzt? Alles kommt in _result_? – Bikee

+1

Nicht sicher, ob es dieses Problem verursacht oder nicht, aber 'extraParams: {Laufzeit: $ ('# Tags'). Val(),' fehlt eine Schließung '}' –

Antwort

3

Use (request.term) unter

data: { term: request.term } 

statt

data: { term: $('#tags').val() } 

In automatische Vervollständigung Textfeld String-Suche erfassen, indem "request.term".

+0

Es funktioniert, danke! :) –