AJAX 自动完成功能不起作用答案

【问题标题】：AJAX autocomplete does not workAJAX 自动完成功能不起作用
【发布时间】：2017-12-29 13:33:38
【问题描述】：

我正在尝试使用 AJAX 使用 ASP.NET 创建一个简单的屏幕，以便从文本框中自动完成文本。

这是我的 ASPX 代码：

<%@ Page Title="" Language="C#" MasterPageFile="~/Pages/MasterPageHeader.Master" AutoEventWireup="true" CodeBehind="MainPage.aspx.cs" Inherits="UBTechSite.Pages.MainPage" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainPage" runat="server">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
    <script type="text/javascript" src="../JSCode/MainPageJS.js"></script>
    <asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true"></asp:ScriptManager>
    <asp:TextBox ID="txtSearch" Text="Find Person" ForeColor="Gray" runat="server" onfocus="ClearWaterMark(this);" onblur="CreatWaterMark(this);"></asp:TextBox>
    <asp:Button ID="btnSearch" runat="server" Text="Search" />
</asp:Content>

这是我的 MainPageJS.js 文件代码：

function ClearWaterMark(ctrl) {
    if (ctrl.value == "Find Person") {
        ctrl.value = "";
        ctrl.style.color = "black";
    }
}

function CreatWaterMark(ctrl) {
    if (ctrl.value.length == 0) {
        ctrl.value = "Find Person";
        ctrl.style.color = "gray";
    }
}

$(document).ready(function () {
    SearchPerson();
});

function SearchPerson() {
    $("#txtSearch").autocomplete({
        minLength: 2,
        source: function (request, response) {
            $.ajax({
                type: "POST",
                contentType: "application/json; charset=utf-8",
                url: "MainPage.aspx/GetPeopleByName",
                data: '{name: "' + $("input[id$=txtSearch]").val() + '" }',
                dataType: "json",
                success: function (data) {
                    response(data.d);
                },
                error: function (result) {
                    alert("No Match");
                }
            });
        }
    });
}

在我的 cs 文件中，我有一个具有 [WebMethod] 属性的函数名称 GetPeopleByName。

我的问题是当我在文本框中输入内容时没有任何反应。

我做错了什么？

提前谢谢你！

【问题讨论】：

标签： c# asp.net autocomplete webforms asp.net-ajax

【解决方案1】：

我正在使用这个http://leaverou.github.io/awesomplete/。 :) 这很容易实现。在您的控制器中，只需创建一个 JsonResult 方法。

【讨论】：

【解决方案2】：

我解决了。

我现在正在使用 AjaxControlToolkit，它工作正常。

【讨论】：