Question

J'ai essayé d'obtenir un exemple simple de la saisie semi-automatique jquery-ui au travail. J'ai une configuration du contrôleur pour gérer la requête, et il renvoie le JSON qui semble être dans l'ordre, mais je reçois pas de suggestions montrant.

Voici les bibliothèques js Je suis notamment:

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

et est ici le javascript et les balises de formulaire:

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

Je reviens une réponse JSON qui semble adapté de mon contrôleur:

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

id et la valeur semblent être la désignation par défaut autocomplete recherche.

Mais je reçois pas de joie du tout. Des pensées?

Était-ce utile?

La solution

Pas la question ici - vous devriez mettre avant css javascript. Toujours.

Vous ne faites rien à la valeur de retour. Vous devez utiliser une fonction de rappel pour prendre ces données et faire quelque chose avec elle. (Le « succès: » paramètre, je crois).

Autres conseils

Merci à la suggestion de Hogan, j'ai ajouté la fonction de rappel suivante au paramètre de réussite, et je suis bon pour aller:

 success: function (data) {
                          response($.map(data, function (item) {
                              return {
                                  label: item.label,
                                  value: item.value
                              }
                          }))
Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top