如何使用asp.net 4.0与c＃一起使用auto complete extender

Question

我只想使用自动完成扩展程序来查找与用户输入文本框相关的结果。 这是我的代码：

[System.Web.Script.Services.ScriptMethod()]
    [System.Web.Services.WebMethod]
    public static List<string> GetTickets(string prefixText)
    {
        using (DataClassesDataContext db = new DataClassesDataContext())
        {
            List<string> Tickets = new List<string>();
            string userid = db.Users.Where(u => u.Username.Equals((String)HttpContext.Current.Session["Username"])).Select(u => u.Ref_no).SingleOrDefault();
            var enquiry = db.Enquiries.Where(i => (i.ForwardTo.Equals(userid) || i.AttendBy.Equals(userid))).ToList(); 
            foreach(var item in enquiry)
            {
                if(item != null)
                {
                    var flag = db.Flags.Where(f => f.Enquiry_History_id.Equals(item.Ref_no) && f.User_id.Equals(userid)).Select(f => new { IsDisplay = f.IsDisplay,IsRead = f.IsRead }).ToList();
                    bool IsIns = true;
                    foreach (var item1 in flag)
                    {
                        if (item1.IsDisplay == false)
                        {
                            IsIns = false;
                        }
                        if (item1.IsRead == true)
                        {
                            IsIns = false;
                        }
                    }
                    if (IsIns == true)
                    {
                        Tickets.Add(item.Ref_no.ToString());
                    }
                }
            }
            return Tickets;
        }
    }

这是我的设计代码：

    <asp:TextBox ID="TextBox1" runat="server" CssClass="input" Width="115px"                                                                      ValidationGroup="TicketSearch"></asp:TextBox>
     <ajaxToolkit:AutoCompleteExtender ID="TextBox1_AutoCompleteExtender" runat="server"
MinimumPrefixLength="1" EnableCaching="true" CompletionSetCount="1" CompletionInterval="1000" ServiceMethod="GetTickets"
TargetControlID="TextBox1" CompletionListCssClass="popUpDialog">
</ajaxToolkit:AutoCompleteExtender>

并显示结果发现我包括这个css类，如：

.popUpDialog
        {
            z-index: 99 !important;
        }

        .autoComplete_listMain
        {
            z-index: 2147483647 !important;
            background: #ffffff;
            border: solid 2px #808080;
            color: #000000;
        }

- - - - - - - - - - - - - - - -更新 - - - - - - - - - ----------------

现在我使用这种技术：

<script language="javascript" type="text/javascript">
    $(function () {
        $('#<%=TextBox1.ClientID%>').autocomplete({
            source: function (request, response) {
                $.ajax({
                    url: "MasterPage.master/GetTickets",
                    data: "{ 'pre':'" + request.term + "'}",
                    dataType: "json",
                    type: "POST",
                    contentType: "application/json; charset=utf-8",
                    success: function (data) {
                        response($.map(data.d, function (item) {
                            return { value: item }
                        }))
                    },
                    error: function (XMLHttpRequest, textStatus, errorThrown) {
                        alert(textStatus);
                    }
                });
            }
        });
    });
</script>

这是设计：

<ajaxToolkit:AutoCompleteExtender runat="server" ID="autoComplete1" TargetControlID="TextBox1" ServicePath="" ServiceMethod="GetTickets" MinimumPrefixLength="1" EnableCaching="true" CompletionListCssClass="completionList" 
                                                                                                                    CompletionListItemCssClass="listItem" 
                                                                                                                    CompletionListHighlightedItemCssClass="itemHighlighted"/>

代码背后：

 [System.Web.Script.Services.ScriptMethod(ResponseFormat = System.Web.Script.Services.ResponseFormat.Json)]
    [System.Web.Services.WebMethod]
    public static List<string> GetTickets(string prefixText)
    {
        using (DataClassesDataContext db = new DataClassesDataContext())
        {
            List<string> Tickets = new List<string>();
            string userid = db.Users.Where(u => u.Username.Equals((String)HttpContext.Current.Session["Username"])).Select(u => u.Ref_no).SingleOrDefault();
            var enquiry = db.Enquiries.Where(i => (i.ForwardTo.Equals(userid) || i.AttendBy.Equals(userid))).ToList();
            foreach (var item in enquiry)
            {
                if (item != null)
                {
                    var flag = db.Flags.Where(f => f.Enquiry_History_id.Equals(item.Ref_no) && f.User_id.Equals(userid)).Select(f => new { IsDisplay = f.IsDisplay, IsRead = f.IsRead }).ToList();
                    bool IsIns = true;
                    foreach (var item1 in flag)
                    {
                        if (item1.IsDisplay == false)
                        {
                            IsIns = false;
                        }
                        if (item1.IsRead == true)
                        {
                            IsIns = false;
                        }
                    }
                    if (IsIns == true)
                    {
                        Tickets.Add(item.Ref_no.ToString());
                    }
                }
            }
            return Tickets;
        }
    }

我在运行时发现此错误：

Server Error in '/CRM' Application.

This type of page is not served.

Description: The type of page you have requested is not served because it has been explicitly forbidden.     Please review the URL below and make sure that it is spelled correctly. 

Requested URL: /CRM/Staff/MasterPage.master/GetTickets

Version Information: Microsoft .NET Framework Version:4.0.30319; ASP.NET Version:4.0.30319.1

- - - - - - - - - - - - - 更新 - - - - - - - - - - - -

我试过Jalpesh的建议

在这里我创建一个服务，如：

using System;
using System.Web;
using System.Collections;
using System.Web.Services;
using System.Web.Services.Protocols;
using System.Data;
using System.Linq;
using System.Configuration;
using System.Collections.Generic;
/// <summary>
/// Summary description for AutoComplete
/// </summary>
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
// To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line. 
// [System.Web.Script.Services.ScriptService]
public class AutoComplete : System.Web.Services.WebService
{

    public AutoComplete()
    {

        //Uncomment the following line if using designed components 
        //InitializeComponent(); 
    }

    [WebMethod]
    public List<string> GetTicketList(string prefixText)
    {
        using (DataClassesDataContext db = new DataClassesDataContext())
        {
            List<string> Tickets = new List<string>();
            string userid = db.Users.Where(u => u.Username.Equals((String)HttpContext.Current.Session["Username"])).Select(u => u.Ref_no).SingleOrDefault();
            var enquiry = db.Enquiries.Where(i => (i.ForwardTo.Equals(userid) || i.AttendBy.Equals(userid))).ToList();
            foreach (var item in enquiry)
            {
                if (item != null)
                {
                    var flag = db.Flags.Where(f => f.Enquiry_History_id.Equals(item.Ref_no) && f.User_id.Equals(userid)).Select(f => new { IsDisplay = f.IsDisplay, IsRead = f.IsRead }).ToList();
                    bool IsIns = true;
                    foreach (var item1 in flag)
                    {
                        if (item1.IsDisplay == false)
                        {
                            IsIns = false;
                        }
                        if (item1.IsRead == true)
                        {
                            IsIns = false;
                        }
                    }
                    if (IsIns == true)
                    {
                        Tickets.Add(item.Ref_no.ToString());
                    }
                }
            }
            return Tickets;
        }
    }
}

这是我的自动完成扩展程序：

  <ajaxToolkit:AutoCompleteExtender runat="server" ID="autoComplete1" TargetControlID="TextBox1" ServicePath="AutoComplete.asmx" ServiceMethod="GetTicketList" MinimumPrefixLength="1" EnableCaching="true" CompletionListCssClass="completionList" 
                                                                                                                    CompletionListItemCssClass="listItem" 
                                                                                                                    CompletionListHighlightedItemCssClass="itemHighlighted"/>      

最后在这里jquery调用它：

<script language="javascript" type="text/javascript">
    $(function () {
        $('#<%=TextBox1.ClientID%>').autocomplete({
            source: function (request, response) {
                $.ajax({
                    url: "AutoComplete.asmx/GetTicketList",
                    data: "{ 'pre':'" + request.term + "'}",
                    dataType: "json",
                    type: "POST",
                    contentType: "application/json; charset=utf-8",
                    success: function (data) {
                        response($.map(data.d, function (item) {
                            return { value: item }
                        }))
                    },
                    error: function (XMLHttpRequest, textStatus, errorThrown) {
                        alert(textStatus);
                    }
                });
            }
        });
    });
</script>

这给了我这样的错误：

Server Error in '/CRM' Application.

Request format is unrecognized for URL unexpectedly ending in '/GetTicketList'.

Description: An unhandled exception occurred during the execution of the current web request. Please review the stack trace for more information about the error and where it originated in the code. 

Exception Details: System.InvalidOperationException: Request format is unrecognized for URL unexpectedly ending in '/GetTicketList'.

Source Error: 

An unhandled exception was generated during the execution of the current web request. Information regarding the origin and location of the exception can be identified using the exception stack trace below.

Stack Trace: 


[InvalidOperationException: Request format is unrecognized for URL unexpectedly ending in '/GetTicketList'.]
   System.Web.Services.Protocols.WebServiceHandlerFactory.CoreGetHandler(Type type, HttpContext context, HttpRequest request, HttpResponse response) +518909
   System.Web.Services.Protocols.WebServiceHandlerFactory.GetHandler(HttpContext context, String verb, String url, String filePath) +212
   System.Web.Script.Services.ScriptHandlerFactory.GetHandler(HttpContext context, String requestType, String url, String pathTranslated) +47
   System.Web.HttpApplication.MapHttpHandler(HttpContext context, String requestType, VirtualPath path, String pathTranslated, Boolean useAppConfig) +203
   System.Web.MapHandlerExecutionStep.System.Web.HttpApplication.IExecutionStep.Execute() +128
   System.Web.HttpApplication.ExecuteStep(IExecutionStep step, Boolean& completedSynchronously) +184

Version Information: Microsoft .NET Framework Version:4.0.30319; ASP.NET Version:4.0.30319.1

Answer 1

您尚未在自动填充扩展程序中添加服务路径。

ServicePath="AutoComplete.asmx"

还有你在自动完成扩展器上面的脚本管理器。 如果没有，请把它放在下面。

<ajaxToolkit:ToolkitScriptManager  ID="ScriptManager1" runat="server">
</ajaxToolkit:ToolkitScriptManager>