Asp.net Webform页面实现jQuery Autocomplete Widget

时间:2014-07-01 18:03:34

标签: asp.net ajax json web-services jquery-autocomplete

我想将jquery自动完成小部件合并到我的aspx页面。 "来源"自动完成来自webservice方法。 我的脚本看起来像这样:

 $(".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);
                    }
                });

使用此设置,当用户键入输入控件时,将从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"写入控制台。

1 个答案:

答案 0 :(得分:1)

返回JSON的.Net Web服务通过将有效负载嵌入到" d"属性(正如您在捕获JSON时所看到的)。

尝试将响应处理更改为从data.d而不仅仅是数据读取,以获取要映射的数组,如下所示:

 response($.map(data.d, function (item) {
                            console.log(item.CodigoAduana);
                            return {
                                label: item.Descripcion,
                                value: item.CodigoAduana
                            };
                        }));