Domanda

Ho cercato di ottenere un semplice esempio del completamento automatico jquery-ui al lavoro. Ho una messa a punto di controllo per gestire la query e restituisce il JSON che sembra essere in ordine, ma sto ottenendo nessun suggerimento rivelando.

Ecco le librerie js Sono compresi:

<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" />

ed ecco il javascript e le tag di modulo:

<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> 

torno una risposta JSON che sembra ragionevole dal mio controllo:

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

id e il valore sembrano essere la denominazione di default che è alla ricerca di completamento automatico.

Ma ottengo nessuna gioia a tutti. qualche idea?

È stato utile?

Soluzione

Non è il problema qui - si dovrebbe mettere css prima di javascript. Sempre.

Non stanno facendo nulla con il valore di ritorno. È necessario utilizzare una funzione di callback per prendere i dati e fare qualcosa con esso. (Il "successo:" il parametro, credo).

Altri suggerimenti

Grazie al suggerimento di Hogan, ho aggiunto la seguente funzione di callback al parametro successo, e sono stato bene ad andare:

 success: function (data) {
                          response($.map(data, function (item) {
                              return {
                                  label: item.label,
                                  value: item.value
                              }
                          }))
Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top