Asp.net Web表单页面实现jQuery自动完成小部件
我想将jquery自动完成小部件合并到我的aspx页面。自动完成的“源”来自webservice方法。 我的脚本如下所示:Asp.net Web表单页面实现jQuery自动完成小部件,asp.net,ajax,json,web-services,jquery-autocomplete,Asp.net,Ajax,Json,Web Services,Jquery Autocomplete,我想将jquery自动完成小部件合并到我的aspx页面。自动完成的“源”来自webservice方法。 我的脚本如下所示: $(".paisProc").autocomplete({ minLength: 0, source: function (request, response) { $.ajax({ type: "POST",
$(".paisProc").autocomplete({
minLength: 0,
source: function (request, response) {
$.ajax({
type: "POST",
url: "/ManifestService.asmx/GetPaises",
dataType: "json",
contentType: "application/json; charset=utf-8",
data: JSON.stringify({ 'term': request.term }),
success: function (data) {
console.log("reading results...");
response($.map(data, function (item) {
console.log(item.CodigoAduana);
return {
label: item.Descripcion,
value: item.CodigoAduana
};
}));
},
error: function (err, status, error) {
console.log(status);
console.log(error);
}
});
response($.map(data.d, function (item) {
console.log(item.CodigoAduana);
return {
label: item.Descripcion,
value: item.CodigoAduana
};
}));
使用此设置,当用户键入输入控件时,预期值将从Web服务返回,但自动完成似乎不起作用。使用Firebug查看页面时,我看到对服务的ajax调用返回以下格式的数据:
{"d":[{"__type":"dhl.domain.Pais","PaisId":1,"CodigoDHL":"AR","CodigoAduana":"528","Descripcion":"ARGENTINA"},
{"__type":"dhl.domain.Pais","PaisId":481,"CodigoDHL":"DZ","CodigoAduana":"208","Descripcion":"ARGELIA"}]}
我看不出我的代码有什么问题,我已经在这个网站上遵循了许多问题的指示,但没有成功。
如果有帮助,请将成功回调中的行
console.log(item.CodigoAduana)
写入控制台“undefined”
.Net web服务返回JSON是通过将负载嵌入到“d”属性中来实现的(正如您在捕获JSON时所看到的)
尝试将响应处理更改为从data.d读取,而不仅仅是数据,以获取要映射的数组,如下所示:
$(".paisProc").autocomplete({
minLength: 0,
source: function (request, response) {
$.ajax({
type: "POST",
url: "/ManifestService.asmx/GetPaises",
dataType: "json",
contentType: "application/json; charset=utf-8",
data: JSON.stringify({ 'term': request.term }),
success: function (data) {
console.log("reading results...");
response($.map(data, function (item) {
console.log(item.CodigoAduana);
return {
label: item.Descripcion,
value: item.CodigoAduana
};
}));
},
error: function (err, status, error) {
console.log(status);
console.log(error);
}
});
response($.map(data.d, function (item) {
console.log(item.CodigoAduana);
return {
label: item.Descripcion,
value: item.CodigoAduana
};
}));