Question

我在JQuery中调用ASP.Net webservice，下拉列表中的响应以JSON格式显示。以下是摘录

$(document).ready(function () {
$("#txtTest").autocomplete({ 
     source: function (request, response) {  
         $.ajax({  
             type: "POST",  
             contentType: "application/json; charset=utf-8", 
             url: "Webservice.asmx/GetNames",
             data: "{'prefix':'" + request.term + "'}",  
             dataType: "json",  
             async: true,  
             success: function (data){  
                response($.map(data, function(item)
                { 
/*Below commented return has to display the First item alone in JSON which fails*/
//return { label: item.First, value: item.First } 
 /* Below return gives the JSON response with first and second*/
      return item ; 
               }));  
            },  
            error: function (result) {  
               alert("Due to unexpected errors we were unable to load data");  
            }  
         });
     },  
     minLength:2
 });
 });

自动完成丢弃的JSON响应为

{"First":"Steve","Second":"AK"}
{"First":"Evet","Second":"EV"}
{"First":"Stevens","Second":"SV"}

如何单独显示“First”项目（如Steve，Evet，Stevens）作为下拉自动完成的输出？

请帮助我！

Answer 1

正如您所描述的那样，“JSON响应”不是有效的JSON。如果这是您的服务返回的，那就错了。该文本代表3个不同的Javascript对象。单独使用这三行中的任何一行都是有效的JSON。将这些行连接在一起，它是无效的JSON。

这是有效的JSON，表示三个对象的数组：

[{"First":"Steve","Second":"AK"},
 {"First":"Evet","Second":"EV"}, 
 {"First":"Stevens","Second":"SV"} ]

（空白无关紧要）

这是无效的JSON：

{"First":"Steve","Second":"AK"} 
{"First":"Evet","Second":"EV"} 
{"First":"Stevens","Second":"SV"}

因此，如果这是对响应的准确描述，那么您的服务就会被破坏。先解决这个问题，然后我们就可以回答这个问题了。

以正确的形式得到回复后，例如，

[{"First":"Steve","Second":"AK"},
 {"First":"Evet","Second":"EV"}, 
 {"First":"Stevens","Second":"SV"} ]

...然后你可以显示结果。但是，您只想显示数组中每个项目的第一个元素。为此，您需要将原始数组映射到不同的数组，即字符串数组而不是对象数组。您可以使用jQuery map()函数来执行此操作。它看起来像这样：

  $.map( realArray, function(val, i) {  ...map one item here...  });

在您的成功函数中，使用您返回的数据，您可以像这样使用它：

        success: function (data){     
            response($.map(data, function(item) {
              return item.First;
            }));
        },

由map调用的函数，对于原始arrap中的每个项目，一次将{"First":"Steve","Second":"AK}之类的项转换为"Steve"之类的项。对于像

这样的整个数组

[{"First":"Steve","Second":"AK"},
 {"First":"Evet","Second":"EV"}, 
 {"First":"Stevens","Second":"SV"} ]

.. $.map()来电的输出为["Steve", "Evet", "Stevens"]。此结果将传递给响应函数，然后在自动完成小部件中显示该项目列表。

Answer 2

我遇到了同样的问题，我设法通过用一些空字符串替换查询中的NULL值来修复它。

自动完成尝试将JSON更改为自动完成项，但是当数据库通过Web服务返回空值时，它无法更改...

使用ASP.Net webservice进行JQuery自动完成

2 个答案: