从ASMX web服务的jQuery自动完成读取XML数据 [英] Reading XML data from ASMX webservice for Jquery autocomplete
问题描述
我和ASMX Web服务不下去了。我们争吵。她带来了争论，我们在过去的了。这是一个痛苦。 ！我们的关系是在岩石
Me and ASMX web services do not get on. We argue. She brings up arguments we had in the past. It's a pain. Our relationship is on the rocks!
我有一个ASMX Web服务，这是我没有与Newtonsoft库序列化（如解释为什么在这里：的 http://encosia.com/2011/04/13 / ASP网的Web服务 - 错误 - 手动JSON序列化/ ）。它看起来是这样的：
I have an ASMX web service, which I haven't serialised with the Newtonsoft library (as explained why here: http://encosia.com/2011/04/13/asp-net-web-services-mistake-manual-json-serialization/). It looks like this:
[WebMethod]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
public string[] GetCitiesWithState(string isoalpha2, string prefixText)
{
var dict = AtomicCore.CityObject.GetCitiesInCountryWithStateAutocomplete(isoalpha2, prefixText);
string[] cities = dict.Values.ToArray();
return cities;
}
够简单吧？ ？XML版本;
Simple enough right? It return this when searching for new:
<?xml version="1.0" encoding="utf-8"?>
<ArrayOfString xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns="http://tempuri.org/">
<string>New Orleans, Louisiana</string>
<string>New York, New York</string>
</ArrayOfString>
我期待JSON，但有点读之后，似乎我不应该尝试和连载输出 - 它应该只是发生吧？无论如何，所以我已经上了前台以下JQuery的：
I was expecting JSON, but after a bit of reading, it seems I shouldn't try and serialise the output - it should just happen right? Anyway, so I have the following JQuery on the frontend:
$('#<%=txtCity.ClientID%>').autocomplete('<%=ResolveUrl("~/AtomicService/Assets.asmx/GetCitiesWithState")%>', {
dataType: 'json',
httpMethod: 'POST',
contentType: 'application/json; charset=utf-8',
parse: function (data) {
var rows = new Array();
for (var i = 0; i < data.d.length; i++) {
rows[i] = { data: data.d[i], value: data.d[i].Value, result: data.d[i].Value };
}
return rows;
},
formatItem: function (row, i, n) {
return row.Value;
},
extraParams: {
minChars: 2,
isoalpha2: '<%=Session["BusinessCountry"].ToString()%>',
maxRows: 20,
prefixText: function () {
return $('#<%=txtCity.ClientID%>').val()
}
},
max: 20
}).result(function (event, data, formatted) {
if (data) {
alert(data['Key']);
}
});
我可以使用Chrome的通话时看到：
I can see the calls using Chrome:
和但所有的东西发生了！没有jQuery的错误，不安排焰火表演，什么都没有。她不理我。
And yet stuff all happens! There is no Jquery errors, no fireworks, no anything. She is ignoring me.
起初我埋怨web服务，但我认为这可能有更多的事情要做，我如何解析和jQuery的格式化数据。
At first I was blaming the webservice, but I think this may have more to do with how I'm parsing and formatting the data in jquery.
因此，我的问题是，我究竟做错了，我怎么能正确地使自动完成工作？
So, my question is, what am I doing wrong and how can I make the autocomplete work correctly?
帮助表示赞赏：）
编辑：这可能没有帮助，但是这是我在小提琴手看到：
It may not be helpful, but this is what I see in Fiddler:
推荐答案
在jQuery用户界面自动完成没有再使用formatItem方法。这和其他许多这样的方法存在于自动完成的早期版本这里曾是插件
The jQuery UI autocomplete does not anymore use the formatItem method. That and many other such methods were present in autocomplete's earlier version that was a plugin here
我已经使用jQuery UI的自动完成重写你的代码，这对我的作品与下面的htm和ASMX文件。
I have rewritten your code using the jQuery UI's autocomplete and it works for me with the below htm and asmx files.
请参阅在 jQueryUI的自动完成你可以使用更多的方法演示。
Refer to the demos on the jQueryUI autocomplete for more methods you could use.
我用从www.json.org
此外，我已经添加了[System.Web.Script.Services.ScriptService]属性到Service类，以便它可以直接从jQuery的调用json2.min.js的。作为一个JSON Web服务
I have used the json2.min.js from www.json.org Also I have added the [System.Web.Script.Services.ScriptService] attribute to the Service1 class so that it could directly be invoked from jQuery as a json web service.
这些文章帮我：
HTM文件
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>jQuery to ASMX</title>
<link rel="Stylesheet" type="text/css"
href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.11/themes/cupertino/jquery-ui.css"/>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<script type="text/javascript"
src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.11/jquery-ui.min.js"></script>
<script type="text/javascript" src="http://localhost/Scripts/json2.min.js"></script>
</head>
<body>
<script type="text/javascript">
$(document).ready(function() {
$("#txtInput").autocomplete({
source:function (request, response) {
var paramters = {
isoalpha2: '<%=Session["BusinessCountry"].ToString()%>',
prefixText: request.term
};
$.ajax({
url: 'Service1.asmx/GetCitiesWithState',
type: 'POST',
dataType: 'json',
contentType: 'application/json; charset=utf-8',
data: JSON.stringify(paramters),
success: function(data) {
response($.each(data.d, function(index, value) {
return {
label: value,
value: index
}
}));
}
});
},
minLength:2,
delay:500
});
});
</script>
<p>
Hello, World!</p>
<label for="txtInput">
Enter the string here:</label><input type="text" id="txtInput"/>
</body>
</html>
的
ASMX文件
The asmx file
using System.Web.Script.Services;
using System.Web.Services;
namespace jQueryAutoCompleteBackEnd
{
/// <summary>
/// Summary description for Service1
/// </summary>
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.ComponentModel.ToolboxItem(false)]
[ScriptService]
public class Service1 : WebService
{
[WebMethod]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
public string[] GetCitiesWithState(string isoalpha2, string prefixText)
{
return new string[] { "New Orleans, Lousiana", "New York, New York" };
}
}
}
这篇关于从ASMX web服务的jQuery自动完成读取XML数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
