Comment les données de Carte de jquery-ui de saisie semi-automatique ne fonctionne pas
je suis à l'aide de jquery ui autocomplete et de faire un appel ajax à l'intérieur de la fonction d'auto-complétion je vais appeler mon contrôleur de l'action qui renvoie du Json , mais les suggestions ne s'affiche pas dans la liste déroulante
Javascript
function log(message) {
$("<div>").text(message).prependTo("#log");
$("#log").scrollTop(0);
}
$("#search").autocomplete({
source: function (request, response) {
$.ajax({
url: "/Home/GetCompanyNames",
dataType: "jsonp",
data: "searchterm=" + request.term,
success: function (data) {
response($.map(data, function (item) {
alert(item.Value);
return {
label: item.Name,
value: item.Name
};
}));
}
});
},
minLength: 2,
select: function (event, ui) {
log(ui.item ?
"Selected: " + ui.item.label :
"Nothing selected, input was " + this.value);
},
open: function () {
$(this).removeClass("ui-corner-all").addClass("ui-corner-top");
},
close: function () {
$(this).removeClass("ui-corner-top").addClass("ui-corner-all");
}
});
});
Action dans le Contrôleur :
public JsonResult GetCompanyNames (string searchterm)
{
var companies = context.companyService.Query().Where(x => x.Name.Contains(searchterm)).ToList();
var list = companies.Select(item => new SearchJsonModel
{
LogoUrl = item.Logo != null || item.Logo != "" ? "<img src='/Upload/" + item.Logo + "' />" : "<img src='/home/image?image=" + item.Name + "' />", Name = item.Name, Value = item.InternetName
}).Select(model => (model)).ToList();
return Json(list, JsonRequestBehavior.AllowGet);
}
SearchJsonModel :
public class SearchJsonModel
{
public string Name { get; set; }
public string Value { get; set; }
public string LogoUrl { get; set; }
}
et c'est ce que j'obtiens en réponse à l'appel ajax ( c'est l'image de firebug )
Veuillez me demander si vous avez besoin de plus de détails et merci d'avance .
Modifier
maintenant, je suis en train d'essayer d'accéder à la valeur sélectionnée dans sélectionner un rappel, mais sa présentation Undefined
select: function (event, ui) {
alert(ui.item.Name);
alert(ui.item.Value);
alert(ui.item.LogoUrl);
},
OriginalL'auteur smart boy | 2012-10-25
Vous devez vous connecter pour publier un commentaire.
Vous avez défini votre
dataType
commejsonp
mais on dirait que vous êtes de retour standardjson
, essayez de changer votredataType
:et quelle est la différence entre
Json
etJsonp
?Je ne crois pas que Wikipédia l'explique assez bon: JSONP, JSON
vérifier mon montage j'ai une question de plus
C'est un peu plus compliqué, comme l'élément réel de votre réponse n'est pas tenue par la saisie semi-automatique. Afin de réaliser que vous avez besoin pour remplacer l'interne
_renderItem
fonction. Veuillez vous référer à la réponse suivante pour un exemple: stackoverflow.com/questions/12855617/... (n'oubliez pas de upvote avec la flèche vers le haut sur la gauche si la réponse vous aide).OriginalL'auteur tpeczek
je ne sais pas quel est le problème dans le code, mais peut-être vous pouvez essayer un autre moyen plus simple de faire la saisie semi-automatique? Comme
html comme
OriginalL'auteur maxs87