jquery-ui zur automatischen Vervollständigung mit ASP MVC Vorschläge nicht angezeigt

Question

Ich habe versucht, ein einfaches Beispiel für die jquery-ui der automatischen Vervollständigung zur Arbeit zu kommen. Ich habe eine Controller-Setup die Abfrage zu handhaben, und es gibt die json, dass Aussehen, um zu sein, aber ich bin immer keine Vorschläge auftauchen.

Hier sind die js Bibliotheken, die ich mit bin:

<script type="text/javascript" language="javascript" src="/Scripts/jquery-1.4.1.js"></script>

<script type="text/javascript" language="javascript" src="/Scripts/jquery-ui-1.8.1.custom.min.js"></script>

 <link href="/Content/jquery-ui-1.8.1.custom.css" rel="stylesheet" type="text/css" />

und hier ist die Javascript und das Formular-Tags:

<script type="text/javascript">
    $(function () {

        $("#organization").autocomplete({
            source: function (request, response) {
                $.ajax({
                    url: '/Organization/OrganizationLookup',
                    dataType: "json",
                    data: {
                        limit: 12,
                        q: request.term
                    }
                })
            },
            minLength: 2
        });
    });
</script> 

<div class="ui-widget"> 
    <label for="organization">Organization: </label> 
    <input id="organization" /> 
</div> 

ich eine JSON-Antwort zurück, dass sieht vernünftig aus meinem Controller:

[
  {
    "id":"Sector A",
    "value":"Sector A"
  },
  {
    "id":"Sector B",
    "value":"Sector B"
  },
  {
    "id":"Sector C",
    "value":"Sector C"
  }
]

id und Wert scheinen der Standardname zu sein, dass die automatische Vervollständigung für sucht.

Aber ich keine Freude überhaupt bekommen. Irgendwelche Gedanken?

Answer 1

hier nicht das Thema - sollten Sie CSS vor Javascript setzen. Immer.

Sie tun nichts mit dem Rückgabewert. Sie benötigen eine Callback-Funktion zu verwenden, die Daten zu nehmen und mit ihm etwas zu tun. (Die "Erfolg:" Parameter, glaube ich).

Answer 2

Dank Hogan Vorschlag, habe ich die folgende Callback-Funktion für den Erfolg Parameter, und ich war gut zu gehen:

 success: function (data) {
                          response($.map(data, function (item) {
                              return {
                                  label: item.label,
                                  value: item.value
                              }
                          }))