使用ASP.Net的JQuery自动完成web服务

问题描述:

我有在JQuery中调用ASP.Net的webservice,下拉的响应以JSON格式。下面是摘录使用ASP.Net的JQuery自动完成web服务

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

我怎么独显“第一”项目(像史蒂夫,EVET,史蒂文斯)作为下拉式输出自动完成?

请帮帮我!

+1

的“JSON反应”,如你所描述它,不是有效的JSON。如果您的服务正在返回,那就错了。该文本代表3个不同的Javascript对象。三条线中的任何一条都是有效的JSON。将这些代码连接在一起,这不是有效的JSON。所以,如果这是一个准确的响应图片,您的服务就会中断。首先解决这个问题,然后我们可以回答这个问题。 – Cheeso

正如您所描述的那样,“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; 
      })); 
     }, 

即得到由地图中的每个项目调用,一旦功能原始的ar,将{"First":"Steve","Second":"AK}这样的项目转换为"Steve"这样的项目。对于像

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

整个阵列的呼叫的..the输出到$.map()["Steve", "Evet", "Stevens"]。这个结果被传递给响应函数,然后在自动完成小部件中显示该项目列表。

+0

嗨,我得到一个有效的JSON响应。 “{”{“First”:“Steve”,“Second”:“AK”}“, ”{“First”:“EVet”,“Second”:“EV”}“, ”{“First” “Stevens”,“Second”:“SV”}“]'请让我知道如何进一步处理。谢谢 – pal

+0

我编辑了我上面的答案。 – Cheeso

我有同样的问题,我设法解决它,通过用一些空字符串替换查询中的NULL值。

自动完成试图将JSON更改为自动完成的项目,但如果数据库是通过Web服务返回空值也改变不了...