我正在尝试创建一个ASP应用程序,可以在其中编写出发地和目的地城市。我想在此文本框上实现Google自动完成。
我已经开发了一个异步方法,当您插入一个或多个字母时返回Google的自动完成函数,名为“getAutoComplete”。
现在我想通过Ajax请求从我的JavaScript中访问它。
以下是我的aspx代码:
<%@ Page Async="true" Title="Home Page" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="googleApiWeb._Default" %>
<asp:Content runat="server" ID="BodyContent" ContentPlaceHolderID="MainContent">
<ol class="round">
<div id="DEPARTURE_CITY" style="margin-top: 15px; margin-left: 15px;">
<asp:Label ID="lblDepartureCity" runat="server" Text="Ville de départ"></asp:Label>
<asp:TextBox runat="server" ID="txbDepartureCity" ClientIDMode="Static" Style="width: 150px;"></asp:TextBox>
</div>
<div id="DESTINATION_CITY" style="margin-top: 15px; margin-left: 15px;">
<asp:Label ID="lblDestinationCity" runat="server" Text="Ville d'arrivé"></asp:Label>
<asp:TextBox runat="server" ID="txbDestinationCity" ClientIDMode="Static" Style="width: 150px;"></asp:TextBox>
</div>
<asp:Button ID="buttonValider" runat="server" Text="Valider" ClientIDMode="Static" OnClick="buttonValider_Click" />
<asp:Label ID="lbl1" runat="server" Text=""></asp:Label>
<asp:Label ID="lbl2" runat="server" Text=""></asp:Label>
</ol>
<script type="text/javascript">
$(document).ready(function () {
//Autocomplete
$("#txbDepartureCity").bind("change paste keyup", function () {
$.ajax({
type: "POST",
url: "/Default.aspx/getAutoComplete",
data: "{'Element':'" + $(this).val() + "'}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
alert(response.d);
}
});
});
$("#txbDestinationCity").bind("change paste keyup", function () {
$.ajax({
type: "POST",
url: "/Default/googleAutoComplete",
data: "{'Element':'" + $(this).val() + "'}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
if (response.d == "NOK") {
//errorResponseAlert();
}
}
});
});
});
</script>
现在在我的代码后台
namespace googleApiWeb
{
public partial class _Default : Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
#region WebMethod autocomplete GoogleApi
[WebMethod(EnableSession = true)]
public static string googleAutoComplete(string Element)
{
string x = getAutoComplete(Element);
return "";
}
[WebMethod(EnableSession = true)]
private static async Task<string> getAutoComplete(string Element)
{
// Adresse à compléter
string location = Element;
// Message d'erreur s'il y en a
string error = "";
// Créer une instance d'auto complete
AutoComplete autoComplete = new AutoComplete();
// Options de l'auto complete
AutoCompleteOptions options = new AutoCompleteOptions()
{
// Obtenir les résultats en français
Language = LanguageEnum.French,
// Pays dans lequel vous souhaitez limiter vos résultats
// Attention : format ISO 3166-1 : "us", "fr", "de", ...
CountryFilter = "fr",
// Type de résultats à retourner.
// Ex : Regions retourne le code postal, ce que ne fait pas Cities.
// Si cette option est vide, tous les résultats sont retournés.
TypeFilter = TypeFilterEnum.Regions
};
// Clé API
string key = "XXXXXXX";
// Appel asynchrone de la méthode de la dll
var listOfLocation = await autoComplete.GetAutoComplete(location, key, null).ContinueWith(t =>
{
// S'il y a une erreur
if (t.IsFaulted)
{
// Message de l'exception
error = t.Exception.InnerException.Message;
return null;
}
// Résultat
return t.Result;
});
var result = listOfLocation.First();
return result;
}
#endregion
protected void buttonValider_Click(object sender, EventArgs e)
{
GetTrip();
getAutoComplete(txbDepartureCity.Text);
}
}
}
错误信息为POST http://localhost:51460/Default.aspx/getAutoComplete 500 (Internal Server Error)
我应该如何处理以便在ajax成功函数中获取我的方法的结果。目的是不使用回调函数获得结果。
谢谢
private
。如果您想要从外部访问,您应该将访问修饰符更改为public
。 - Abdurrahman I.