未调用 Jquery 自动完成成功处理程序答案

【问题标题】：Jquery Autocomplete success handler not invoked未调用 Jquery 自动完成成功处理程序
【发布时间】：2013-11-11 11:42:03
【问题描述】：

这是aspx代码：

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TestingJqueryAutoComplete.aspx.cs"
 Inherits="ProjectForTestingPurpose.TestingJqueryAutoComplete" %>

<!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 runat="server">
 <title></title>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js" type="text/javascript"></script>

<style type="text/css">
        *
        {
            margin:0; padding:0;
        }
</style>

<script type="text/javascript">
    $(document).ready(function () {

        $("#txtCities").autocomplete({
            minLength: 2,
            source: function (request, response) {
                $.ajax({
                    type: "POST",
                    dataType: "json",
                    url: "/GenericAjaxHandler.ashx",
                    data: { text: request.term, type: "requestcities" }
                }); //ajax
            }, //source
            success: function (data) {
                debugger;
                alert(data);
                response($.map(data, function (item) {
                    return {
                        label: item.name,
                        value: item.name
                    }
                }
                    )//function
                ); //response
            }, //success
            error: function (response) {
                debugger;
                alert(response.responseText);
            },
            failure: function (response) {
                debugger;
                alert(response.responseText);
            },
            select: function (event, ui) {
                alert("hello");
            }

        }); // autocomplete

    });            // document ready
</script>

城市

服务器端代码。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace ProjectForTestingPurpose
{
    /// <summary>
    /// Summary description for GenericAjaxHandler
    /// </summary>
    public class GenericAjaxHandler : IHttpHandler
    {

        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "application/json";

            if (context.Request["type"].ToString().ToLower() == "requestcities")
            {
                string response = string.Empty;

                response = "[{\"name\":\"Islamabad\"},{\"name\":\"Lahore\"},{\"name\":\"Karachi\"}]";

                context.Response.Write(response);
            }
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }
}

我不知道没有调用 jquery 自动完成的成功处理程序的问题。

【问题讨论】：

检查控制台是否有错误。您是否从其他处理程序中看到 alert？
是的，我检查了控制台并且没有调用任何处理程序。

标签： jquery asp.net autocomplete

【解决方案1】：

看起来这不是自动完成处理程序的问题。可能是您创建的 JSON 格式不正确。为避免这种情况，您必须创建一个通用列表集合并将此集合序列化为 JSON

代码示例

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace ProjectForTestingPurpose
{
    /// <summary>
    /// Summary description for GenericAjaxHandler
    /// </summary>
    public class GenericAjaxHandler : IHttpHandler
    {

        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "application/json";

            if (context.Request["type"].ToString().ToLower() == "requestcities")
            {
                string response = string.Empty;

                List<City> lstCities = new List<>();

                City city = new City();
                city.Name = "Islamabad";
                lstCities.Add(city);

                city = new City();
                city.Name = "Lahore";
                lstCities.Add(city);

                city = new City();
                city.Name = "Karachi";
                lstCities.Add(city);

                JavaScriptSerializer serializer = new JavaScriptSerializer();
                response = serializer.serialize(lstCities)

                context.Response.Write(response);
            }
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }

    public class City
    {
      private string _name;

      public City()
      {
      }

      public string Name
      {
        get;
        set;
      }
    }
}

【讨论】：