Jquery-UI 自动完成 asp.net 搜索文本框答案

【问题标题】：Jquery-UI autocomplete asp.net search text boxJquery-UI 自动完成 asp.net 搜索文本框
【发布时间】：2018-07-29 00:40:26
【问题描述】：

我的前端有一个文本框，我正在尝试根据 sql 查询返回的内容来实现自动建议。我正在使用 jquery 库并将它们导入我的解决方案。当我继续运行它时，尽管我在搜索框中输入了一个字母，但它会遇到“不匹配错误”。我的代码中是否缺少某些内容？

aspx代码如下：

<link href="jquery-ui.css" rel="stylesheet" type="text/css" />  
<script src="Scripts/jquery.min.js" type="text/javascript"></script>  
<script src="Scripts/jquery-ui.min.js" type="text/javascript"></script>

    <script type="text/javascript">
    $(document).ready(function () {
        SearchText();
    });
    function SearchText() {
        $("#SearchBox").autocomplete({
            source: function (request, response) {
                $.ajax({
                    type: "POST",
                    contentType: "application/json; charset=utf-8",
                    url: "CompanyPage.aspx/GetCompanyName",
                    data: "{'cmpName':'" + document.getElementById('SearchBox').value + "'}",
                    dataType: "json",
                    success: function (data) {
                        response(data.d);
                    },
                    error: function (result) {
                        alert("No Match");
                    }
                });
            }
        });
    }
</script>  

<asp:TextBox ID="SearchBox" placeholder="Enter company name to search on" runat="server" Width="322px" Height="16px" style="margin-left: 22px; margin-top: 0px" OnTextChanged="SearchBox_TextChanged"></asp:TextBox>

aspx.cs 代码：

 [WebMethod] 
        public static List<string> GetCompanyName(string cmpName)
        {
            List<string> cmpResult = new List<string>();
            string connectionString = ConfigurationManager.ConnectionStrings["DBConnection"].ConnectionString;
            SqlConnection cn = new SqlConnection(connectionString);
            using (SqlCommand cmd = new SqlCommand("[searchCompanyName]", cn))
            {
                    cmd.Connection = cn;
                    cn.Open();
                    cmd.Parameters.AddWithValue("@CompanyName", cmpName);
                    SqlDataReader dr = cmd.ExecuteReader();
                    while (dr.Read())
                    {
                        cmpResult.Add(dr["CompanyName"].ToString());
                    }
                    cn.Close();
                    return cmpResult;
            }

        }

SQL 存储过程：

    ALTER PROCEDURE [dbo].[searchCompanyName] 
    @CompanyName varchar(50)
AS
BEGIN
    SET NOCOUNT ON;

    SELECT CompanyName FROM Company
    WHERE CompanyName like @CompanyName + '%'

END

【问题讨论】：

你检查data.d中是否有任何东西？
不知道如何调试以找出 data.d 中是否有任何内容？
不应该是这样的：success: function (result) { response(result.d); }, ?
简单：alert(data.d) 或将单词debugger; 作为success 的第一行
是的，因为您需要查看什么样的对象，然后查看错误消息。但是现在不要担心，你知道问题出在服务器上，所以修复它。确保在服务器上接收到cmpName。如果不解决这个问题。然后确保服务器返回数据。花点时间调试它。

标签： c# asp.net jquery-ui autocomplete

【解决方案1】：

ajax：

    $(document).ready(function () {
    SearchText();
});
function SearchText() {
    $(".autosuggest").autocomplete({
        source: function (request, response) {
            $.ajax({
                type: "POST",
                contentType: "application/json; charset=utf-8",
                url: "CompanyPage.aspx/GetCompanyData",
                data: "{'companyname':'" + document.getElementById('SearchBox').value + "'}",
                dataType: "json",
                success: function (data) {
                    if (data != null) {

                        response(data.d);
                    }
                },
                error: function (result) {
                    alert("Error");
                }
            });
        }
    });
}

ajax.cs

[WebMethod]
        public static List<string> GetCompanyData(string companyname)
    {
        List<string> result = new List<string>();
        string connectionString = ConfigurationManager.ConnectionStrings["DBConnection"].ConnectionString;
        SqlConnection con = new SqlConnection(connectionString);


        SqlCommand cmd = new SqlCommand("[searchCompanyName]", con);
        cmd.CommandType = CommandType.StoredProcedure;
            con.Open();
            cmd.Parameters.AddWithValue("@companyname", companyname);
                SqlDataReader dr = cmd.ExecuteReader();

                while (dr.Read())
                {
                    result.Add(dr["companyname"].ToString());
                }
                return result;
        }

【讨论】：